
/************************** font family: Noto Sans ********************************
@font-face {
  font-family: 'NS-regular';
  font-style: normal;
  font-display: fallback;
  src: url('/Content/fonts/NotoSans/noto-sans-kr-v13-korean-regular.woff') format('woff2');
}
@font-face {
  font-family: 'NS-light';
  font-style: normal;
  font-display: fallback;
  src: url('/Content/fonts/NotoSans/noto-sans-kr-v13-korean-300.woff2') format('woff2');
}
@font-face {
  font-family: 'NS-medium';
  font-style: normal;
  font-display: fallback;
  src: url('/Content/fonts/NotoSans/noto-sans-kr-v13-korean-500.woff2') format('woff2');
}
@font-face {
  font-family: 'NS-bold';
  font-style: normal;
  font-display: fallback;
  src: url('/Content/fonts/NotoSans/noto-sans-kr-v13-korean-700.woff2') format('woff2');
}
@font-face {
  font-family: 'NS-black';
  font-style: normal;
  font-display: fallback;
  src: url('/Content/fonts/NotoSans/NotoSansKR-Black.woff2') format('woff2');
}
*/

:root { /*** root에는 각 속성값들을 '정의'만 한다 ***/
    /********** font size START **********/
    --font-size-72: 72px;
    --font-size-64: 64px;
    --font-size-56: 56px;
    --font-size-48: 48px;
    --font-size-40: 40px;
    --font-size-32: 32px;
    --font-size-30: 30px;
    --font-size-28: 28px;
    --font-size-25: 25px;
    --font-size-24: 24px;
    --font-size-22: 22px;
    --font-size-20: 20px;
    --font-size-18: 18px;
    --font-size-17: 17px;
    --font-size-16: 16px;
    --font-size-15: 15px;
    --font-size-14: 14px;
    --font-size-13: 13px;
    --font-size-12: 12px;
    --font-size-11: 11px;
    /******************** color START ********************/
    /* Gray Neutral */
    --gray-neutral-0: #f8f8f8;
    --gray-neutral-1: #f4f4f4;
    --gray-neutral-2: #ededed;
    --gray-neutral-3: #e0e0e0;
    --gray-neutral-4: #cfd0d1;
    --gray-neutral-5: #b2b4b8;
    --gray-neutral-6: #81848b;
    --gray-neutral-7: #4b4f5a;
    --gray-neutral-8: #252933;
    --color-f8f8f8: #f8f8f8;
    --color-f4f4f4: #f4f4f4;
    --color-ededed: #ededed;
    --color-e0e0e0: #e0e0e0;
    --color-cfd0d1: #cfd0d1;
    --color-b2b4b8: #b2b4b8;
    --color-81848b: #81848b;
    --color-4b4f5a: #4b4f5a;
    --color-252933: #252933;
    /* Gray Pale */
    --gray-pale-0: #f7f8fa;
    --gray-pale-1: #f0f2f5;
    --gray-pale-2: #e9ecf0;
    --gray-pale-3: #dcdfe3;
    --gray-pale-4: #c7cbd1;
    --gray-pale-5: #b3bbc5;
    --gray-pale-6: #718093;
    --gray-pale-7: #3d4861;
    --gray-pale-8: #182031;
    --gray-pale-f7f8fa: #f7f8fa;
    --gray-pale-f0f2f5: #f0f2f5;
    --gray-pale-e9ecf0: #e9ecf0;
    --gray-pale-dcdfe3: #dcdfe3;
    --gray-pale-c7cbd1: #c7cbd1;
    --gray-pale-b3bbc5: #b3bbc5;
    --gray-pale-718093: #718093;
    --gray-pale-3d4861: #3d4861;
    --gray-pale-182031: #182031;
    /* Red */
    --red-1: #FFF0F3;
    --red-2: #FFE6EB;
    --red-3: #FFD4DC;
    --red-4: #FCB6C3;
    --red-5: #F78194;
    --red-6: #F25C75;
    --red-7: #CC1F3B; /* Primary */
    --red-8: #971B2F; /* Brand CI */
    --color-fff0f3: #FFF0F3;
    --color-ffe6eb: #FFE6EB;
    --color-ffd4dc: #FFD4DC;
    --color-fcb6c3: #FCB6C3;
    --color-f78194: #F78194;
    --color-f25c75: #F25C75;
    --color-cc1f3b: #CC1F3B;
    --color-971b2f: #971B2F;
    /* Green */
    --green-1: #F0FAF7;
    --green-2: #E4F7F1;
    --green-3: #CAEDE2;
    --green-4: #9FE0CC;
    --green-5: #70CCAF;
    --green-6: #47B998;
    --green-7: #0E8A65;
    --green-8: #0A6649;
    --color-f0faf7: #F0FAF7;
    --color-34f7f1: #E4F7F1;
    --color-caede2: #CAEDE2;
    --color-9fe0cc: #9FE0CC;
    --color-70ccaf: #70CCAF;
    --color-47b998: #47B998;
    --color-0e8a65: #0E8A65;
    --color-0a6649: #0A6649;
    /* Blue */
    --blue-1: #F0F6FF;
    --blue-2: #E6EFFF;
    --blue-3: #D4E4FF;
    --blue-4: #B6D0FC;
    --blue-5: #7CABF7;
    --blue-6: #4C8DF5;
    --blue-7: #1E66D9;
    --blue-8: #124FB3;
    --blue-9: #1E63D1;
    --color-f0f6ff: #F0F6FF;
    --color-e6efff: #E6EFFF;
    --color-d4e4ff: #D4E4FF;
    --color-b6d0fc: #B6D0FC;
    --color-7cabf7: #7CABF7;
    --color-4c8df5: #4C8DF5;
    --color-1e66d9: #1E66D9;
    --color-124fb3: #124FB3;
    --color-1e63d1: #1E63D1;
    /* Orange */
    --orange-1: #FCF1E3;
    --orange-2: #FFEAD1;
    --orange-3: #FFDCB8;
    --orange-4: #FFCD94;
    --orange-5: #FFA947;
    --orange-6: #EF8100;
    --orange-7: #D47100;
    --orange-8: #A65800;
    --color-fcf1e3: #FCF1E3;
    --color-ffead1: #FFEAD1;
    --color-ffdcb8: #FFDCB8;
    --color-ffcd94: #FFCD94;
    --color-ffa947: #FFA947;
    --color-ef8100: #EF8100;
    --color-d47100: #D47100;
    --color-a65800: #A65800;
}
/***************** 폰트 관련 START *****************/

/******************** Font Family ********************/
/* 
    NOTE: 2023.02.16 김홍식 - 현재는 FAQ 리뉴얼에만 적용되어 있음 - FAQV2.cshtml 
    TODO: 추후 네이밍 및 공통 부분을 다시 정의 필요할 수 있음
*/
.lbw-ff-nskr-reg, .lbw-ff-nskr-reg span {
    font-family: 'NotoSansKR-Regular';
}

.lbw-ff-nskr-med, .lbw-ff-nskr-med span {
    font-family: 'NotoSansKR-Medium';
}

.lbw-ff-nskr-bold, .lbw-ff-nskr-bold span {
    font-family: 'NotoSansKR-Bold';
}

/*************** Bold ***************/
.ns-bk72 {
    font-size: var(--font-size-72);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk64 {
    font-size: var(--font-size-64);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk56 {
    font-size: var(--font-size-56);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk48 {
    font-size: var(--font-size-48);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk40 {
    font-size: var(--font-size-40);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk32 {
    font-size: var(--font-size-32);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-b30 {
    font-size: var(--font-size-30);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk28 {
    font-size: var(--font-size-28);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk25 {
    font-size: var(--font-size-25);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk24 {
    font-size: var(--font-size-24);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk22 {
    font-size: var(--font-size-22);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk20 {
    font-size: var(--font-size-20);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk18 {
    font-size: var(--font-size-18);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk17 {
    font-size: var(--font-size-17);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk16 {
    font-size: var(--font-size-16);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk15 {
    font-size: var(--font-size-15);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk14 {
    font-size: var(--font-size-14);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk13 {
    font-size: var(--font-size-13);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk12 {
    font-size: var(--font-size-12);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}

.ns-bk11 {
    font-size: var(--font-size-11);
    font-weight: 900;
    /*font-family: 'NS-black';*/
}
/*************** Bold ***************/
.ns-b72 { /* ex) NotoSans-Bold-72 */
    font-size: var(--font-size-72);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b64 {
    font-size: var(--font-size-64);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b56 {
    font-size: var(--font-size-56);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b48 {
    font-size: var(--font-size-48);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b40 {
    font-size: var(--font-size-40);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b32 {
    font-size: var(--font-size-32);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b30 {
    font-size: var(--font-size-30);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b28 {
    font-size: var(--font-size-28);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b25 {
    font-size: var(--font-size-25);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b24 {
    font-size: var(--font-size-24);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b22 {
    font-size: var(--font-size-22);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b20 {
    font-size: var(--font-size-20);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b18 {
    font-size: var(--font-size-18);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b17 {
    font-size: var(--font-size-17);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b16 {
    font-size: var(--font-size-16);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b15 {
    font-size: var(--font-size-15);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b14 {
    font-size: var(--font-size-14);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b13 {
    font-size: var(--font-size-13);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b12 {
    font-size: var(--font-size-12);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}

.ns-b11 {
    font-size: var(--font-size-11);
    font-weight: 700;
    /*font-family: 'NS-bold';*/
}
/*************** Medium ***************/
.ns-m72 {
    font-size: var(--font-size-72);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m64 {
    font-size: var(--font-size-64);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m56 {
    font-size: var(--font-size-56);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m48 {
    font-size: var(--font-size-48);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m40 {
    font-size: var(--font-size-40);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m32 {
    font-size: var(--font-size-32);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m30 {
    font-size: var(--font-size-30);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m28 {
    font-size: var(--font-size-28);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m25 {
    font-size: var(--font-size-25);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m24 {
    font-size: var(--font-size-24);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m22 {
    font-size: var(--font-size-22);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m20 {
    font-size: var(--font-size-20);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m18 {
    font-size: var(--font-size-18);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m17 {
    font-size: var(--font-size-17);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m16 {
    font-size: var(--font-size-16);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m15 {
    font-size: var(--font-size-15);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m14 {
    font-size: var(--font-size-14);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m13 {
    font-size: var(--font-size-13);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m12 {
    font-size: var(--font-size-12);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}

.ns-m11 {
    font-size: var(--font-size-11);
    font-weight: 500;
    /*font-family: 'NS-medium';*/
}
/************** Regular **************/
.ns-r72 {
    font-size: var(--font-size-72);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r64 {
    font-size: var(--font-size-64);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r56 {
    font-size: var(--font-size-56);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r48 {
    font-size: var(--font-size-48);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r40 {
    font-size: var(--font-size-40);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r32 {
    font-size: var(--font-size-32);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r30 {
    font-size: var(--font-size-30);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r28 {
    font-size: var(--font-size-28);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r25 {
    font-size: var(--font-size-25);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r24 {
    font-size: var(--font-size-24);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r22 {
    font-size: var(--font-size-22);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r20 {
    font-size: var(--font-size-20);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r18 {
    font-size: var(--font-size-18);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r17 {
    font-size: var(--font-size-17);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r16 {
    font-size: var(--font-size-16);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r15 {
    font-size: var(--font-size-15);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r14 {
    font-size: var(--font-size-14);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r13 {
    font-size: var(--font-size-13);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r12 {
    font-size: var(--font-size-12);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}

.ns-r11 {
    font-size: var(--font-size-11);
    font-weight: 400;
    /*font-family: 'NS-regular';*/
}
/*************** Light ***************/
.ns-l72 {
    font-size: var(--font-size-72);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l64 {
    font-size: var(--font-size-64);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l56 {
    font-size: var(--font-size-56);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l48 {
    font-size: var(--font-size-48);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l40 {
    font-size: var(--font-size-40);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l32 {
    font-size: var(--font-size-32);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l30 {
    font-size: var(--font-size-30);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l28 {
    font-size: var(--font-size-28);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l25 {
    font-size: var(--font-size-25);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l24 {
    font-size: var(--font-size-24);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l22 {
    font-size: var(--font-size-22);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l20 {
    font-size: var(--font-size-20);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l18 {
    font-size: var(--font-size-18);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l17 {
    font-size: var(--font-size-17);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l16 {
    font-size: var(--font-size-16);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l15 {
    font-size: var(--font-size-15);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l14 {
    font-size: var(--font-size-14);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l13 {
    font-size: var(--font-size-13);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l12 {
    font-size: var(--font-size-12);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

.ns-l11 {
    font-size: var(--font-size-11);
    font-weight: 400;
    /*font-family: 'NS-light';*/
}

/* Font Color Gray Neutral */
.fc-gn0 {
    color: var(--gray-neutral-0);
}

.fc-gn1 {
    color: var(--gray-neutral-1);
}

.fc-gn2 {
    color: var(--gray-neutral-2);
}

.fc-gn3 {
    color: var(--gray-neutral-3);
}

.fc-gn4 {
    color: var(--gray-neutral-4);
}

.fc-gn5 {
    color: var(--gray-neutral-5);
}

.fc-gn6 {
    color: var(--gray-neutral-6);
}

.fc-gn7 {
    color: var(--gray-neutral-7);
}

.fc-gn8 {
    color: var(--gray-neutral-8);
}
/* Font Color Gray Pale */
.fc-gp0 {
    color: var(--gray-pale-0);
}

.fc-gp1 {
    color: var(--gray-pale-1);
}

.fc-gp2 {
    color: var(--gray-pale-2);
}

.fc-gp3 {
    color: var(--gray-pale-3);
}

.fc-gp4 {
    color: var(--gray-pale-4);
}

.fc-gp5 {
    color: var(--gray-pale-5);
}

.fc-gp6 {
    color: var(--gray-pale-6);
}

.fc-gp7 {
    color: var(--gray-pale-7);
}

.fc-gp8 {
    color: var(--gray-pale-8);
}
/* Font Color Red */
.fc-r0 {
    color: var(--red-1);
}

.fc-r1 {
    color: var(--red-2);
}

.fc-r2 {
    color: var(--red-3);
}

.fc-r3 {
    color: var(--red-4);
}

.fc-r4 {
    color: var(--red-5);
}

.fc-r5 {
    color: var(--red-6);
}

.fc-r6 {
    color: var(--red-7);
}

.fc-r7 {
    color: var(--red-8);
}
/* Font Color Green */
.fc-g0 {
    color: var(--green-1);
}

.fc-g1 {
    color: var(--green-2);
}

.fc-g2 {
    color: var(--green-3);
}

.fc-g3 {
    color: var(--green-4);
}

.fc-g4 {
    color: var(--green-5);
}

.fc-g5 {
    color: var(--green-6);
}

.fc-g6 {
    color: var(--green-7);
}

.fc-g7 {
    color: var(--green-8);
}
/* Font Color Blue */
.fc-b0 {
    color: var(--blue-1);
}

.fc-b1 {
    color: var(--blue-2);
}

.fc-b2 {
    color: var(--blue-3);
}

.fc-b3 {
    color: var(--blue-4);
}

.fc-b4 {
    color: var(--blue-5);
}

.fc-b5 {
    color: var(--blue-6);
}

.fc-b6 {
    color: var(--blue-7);
}

.fc-b7 {
    color: var(--blue-8);
}

.fc-b8 {
    color: var(--blue-9);
}
/* Font Color Orange */
.fc-o0 {
    color: var(--orange-1);
}

.fc-o1 {
    color: var(--orange-2);
}

.fc-o2 {
    color: var(--orange-3);
}

.fc-o3 {
    color: var(--orange-4);
}

.fc-o4 {
    color: var(--orange-5);
}

.fc-o5 {
    color: var(--orange-6);
}

.fc-o6 {
    color: var(--orange-7);
}

.fc-o7 {
    color: var(--orange-8);
}



/*************** Button ***************/
/* Button */
.lbw-btn-s {
    padding: 10px 16px;
    border-radius: 8px;
    border: solid 1px var(--gray-pale-4);
    font-size: 14px;
    font-weight: 500;
}

    .lbw-btn-s:hover {
        box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
    }

    .lbw-btn-s:active {
        background-color: var(--gray-pale-1);
    }

    .lbw-btn-s:disabled {
        border: solid 1px var(--gray-pale-3);
    }

    .lbw-btn-s.lbw-btn-red {
        background-color: var(--red-8);
        border: solid 1px var(--red-8);
        color: #ffffff
    }

.lbw-btn-l {
    padding: 10px 16px;
    border-radius: 8px;
    border: solid 1px var(--gray-pale-4);
    font-size: 16px;
    font-weight: 500;
    color: var(--gray-pale-8);
}

    .lbw-btn-l:hover {
        box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
    }

    .lbw-btn-l:active {
        background-color: var(--gray-pale-1);
    }

    .lbw-btn-l:disabled {
        border: solid 1px var(--gray-pale-3);
    }

    .lbw-btn-l.lbw-btn-red {
        background-color: var(--red-8);
        border: solid 1px var(--red-8);
        color: #ffffff
    }
    /* Red Button */
    .lbw-btn-s.lbw-btn-red,
    .lbw-btn-m.lbw-btn-red,
    .lbw-btn-l.lbw-btn-red {
        background-color: var(--red-8);
        border: solid 1px var(--red-8);
        color: #ffffff
    }

        .lbw-btn-s.lbw-btn-red:hover,
        .lbw-btn-m.lbw-btn-red:hover,
        .lbw-btn-l.lbw-btn-red:hover {
            box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
        }

        .lbw-btn-s.lbw-btn-red:active,
        .lbw-btn-m.lbw-btn-red:active,
        .lbw-btn-l.lbw-btn-red:active {
            background-color: var(--red-7);
        }

        .lbw-btn-s.lbw-btn-red:disabled,
        .lbw-btn-m.lbw-btn-red:disabled,
        .lbw-btn-l.lbw-btn-red:disabled {
            border: solid 1px var(--red-4);
            background-color: var(--red-4);
        }

.lbw-btn-icon {
    display: flex;
    align-items: center;
}

.lbw-btn-s.lbw-btn-icon .icon {
    width: 16px;
    height: 16px;
    margin-right: 8px;
}

.lbw-btn-m.lbw-btn-icon .icon {
    width: 20px;
    height: 20px;
    margin-right: 8px;
}

.lbw-btn-l.lbw-btn-icon .icon {
    width: 24px;
    height: 24px;
    margin-right: 10px;
}

.lbw-btn-s.lbw-btn-icon .svg-ic,
.lbw-btn-m.lbw-btn-icon .svg-ic,
.lbw-btn-l.lbw-btn-icon .svg-ic {
    fill: var(--gray-pale-6)
}

.lbw-btn-s.lbw-btn-red.lbw-btn-icon .svg-ic,
.lbw-btn-m.lbw-btn-red.lbw-btn-icon .svg-ic,
.lbw-btn-l.lbw-btn-red.lbw-btn-icon .svg-ic {
    fill: #fff
}

/******************** Text Button ********************/
/* 
    NOTE: 2023.02.16 김홍식 - 현재는 FAQ 리뉴얼에만 적용되어 있음 - FAQV2.cshtml 
    TODO: 추후 네이밍 및 공통 부분을 다시 정의 필요할 수 있음
*/
/* Text Button 0 - 확인 버튼 */
.lbw-textbtn0-default {
    padding: 12px 20px;
    border: none;
    border-radius: 10px;
    color: #fff;
    background-color: var(--red-8);
}

    .lbw-textbtn0-default span {
        /*color: var(--red-7);*/
    }

    .lbw-textbtn0-default:hover {
        /*padding: 12px 20px;
    border: none;
    border-radius: 10px;*/
        /*color: var(--red-7);*/
        background-color: var(--red-7);
    }

        .lbw-textbtn0-default:hover span {
            /*color: var(--red-7);*/
        }

    .lbw-textbtn0-default:active {
        /*    padding: 12px 20px;
    border: none;
    border-radius: 10px;
    color: var(--red-7);*/
        background-color: var(--red-4);
    }

        .lbw-textbtn0-default:active span {
            /*color: var(--red-7);*/
        }

    .lbw-textbtn0-default:disabled {
        /*    padding: 12px 20px;
    border: none;
    border-radius: 10px;
    color: var(--blue-5);*/
        background-color: var(--red-1);
    }

        .lbw-textbtn0-default:disabled span {
            /*color: var(--blue-5);*/
        }

/* Text Button 1 - 화살표 확인 버튼 */ /* NOTE: 2023.02.22 김홍식 - 현재는 Registration 페이지 리뉴얼에만 적용되어 있음 */
.lbw-textbtn1-default {
    padding: 12px 16px 12px 20px;
    border: none;
    border-radius: 10px;
    color: #fff;
    background-color: var(--red-6);
}

    .lbw-textbtn1-default span {
        /*color: var(--blue-7);*/
    }

    .lbw-textbtn1-default:hover {
        /*color: var(--blue-7);*/
        background-color: var(--red-7);
    }

        .lbw-textbtn1-default:hover span {
            /*color: var(--blue-7);*/
        }

    .lbw-textbtn1-default:active {
        /*color: var(--blue-7);*/
        background-color: var(--red-8);
    }

        .lbw-textbtn1-default:active span {
            /*color: var(--blue-7);*/
        }

    .lbw-textbtn1-default:disabled {
        color: #fff;
        background-color: var(--red-3);
    }

        .lbw-textbtn1-default:disabled span {
            /*color: var(--blue-5);*/
        }

/* Text Button 3 - 화살표 이전 버튼 */ /* NOTE: 2023.02.22 김홍식 - 현재는 Registration 페이지 리뉴얼에만 적용되어 있음 */
.lbw-textbtn3-default {
    padding: 12px 20px 12px 16px;
    border: none;
    border-radius: 10px;
    color: var(--gray-pale-8);
    background-color: #fff;
}

    .lbw-textbtn3-default span {
        color: var(--gray-pale-8);
    }

    .lbw-textbtn3-default:hover {
        color: var(--gray-pale-8);
        background-color: var(--gray-pale-1);
    }

        .lbw-textbtn3-default:hover span {
            color: var(--gray-pale-8);
        }

    .lbw-textbtn3-default:active {
        color: var(--gray-pale-8);
        background-color: var(--gray-pale-2);
    }

        .lbw-textbtn3-default:active span {
            color: var(--gray-pale-8);
        }

    .lbw-textbtn3-default:disabled {
        color: var(--gray-pale-5);
        background-color: #fff;
    }

        .lbw-textbtn3-default:disabled span {
            color: var(--gray-pale-5);
        }


/******************** Input Text Field ********************/
/* 
    NOTE: 2023.02.16 김홍식 - 현재는 FAQ 리뉴얼에만 적용되어 있음 - FAQV2.cshtml 
    TODO: 추후 네이밍 및 공통 부분을 다시 정의 필요할 수 있음
*/
input.lbw-textfield0-default {
    padding: 12px 20px;
    border-radius: 10px;
    border: 1px solid var(--gray-pale-3);
    color: var(--gray-pale-8);
    background-color: #fff;
}

    input.lbw-textfield0-default::placeholder {
        color: var(--gray-pale-5);
    }

    input.lbw-textfield0-default:focus {
        border: 1px solid var(--gray-pale-8);
    }

/******************** Select Box ********************/
select.lbw-select0 { /* NOTE: 2023.02.22 김홍식 - 현재는 Registration 페이지 리뉴얼에만 적용되어 있음 */
    padding: 12px 16px 12px 20px;
    border-radius: 10px;
    border: solid 1px var(--gray-pale-3);
    background-color: #fff;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url('images/dropdown.png') no-repeat 96% center;
    font-family: 'NotoSansKR-Regular';
    color: var(--gray-pale-8);
}


/*************** Checkbox - Default ***************/
.lbw-checkbox-wrapper,
.lbw-radiobutton-wrapper {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    position: relative;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 14px;
    user-select: none;
}

    .lbw-checkbox-wrapper.lbw-depth1,
    .lbw-radiobutton-wrapper.lbw-depth1 {
        padding-left: 25px;
    }

    .lbw-checkbox-wrapper input,
    .lbw-radiobutton-wrapper input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

    .lbw-checkbox-wrapper .checkmark,
    .lbw-radiobutton-wrapper .checkmark {
        position: absolute;
        top: 0;
        left: 0;
        height: 16px;
        width: 16px;
        background-color: transparent;
        border: 1px solid var(--gray-pale-7);
        border-radius: 4px
    }

    .lbw-checkbox-wrapper:hover input ~ .checkmark,
    .lbw-radiobutton-wrapper:hover input ~ .checkmark {
        background-color: var(--gray-pale-3);
    }

    .lbw-checkbox-wrapper input:checked ~ .checkmark,
    .lbw-radiobutton-wrapper input:checked ~ .checkmark {
        background-color: var(--gray-pale-7);
    }

    .lbw-checkbox-wrapper .checkmark:after,
    .lbw-radiobutton-wrapper .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }

    .lbw-checkbox-wrapper input:checked ~ .checkmark:after,
    .lbw-radiobutton-wrapper input:checked ~ .checkmark:after {
        display: block;
    }

    .lbw-checkbox-wrapper .checkmark:after
    .lbw-radiobutton-wrapper .checkmark:after {
        left: 5px;
        top: 2px;
        width: 4px;
        height: 7px;
        border: solid white;
        border-width: 0 2px 2px 0;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    /*************** Checkbox - Red ***************/
    .lbw-checkbox-wrapper.lbw-red,
    .lbw-radiobutton-wrapper.lbw-red {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        /*display: block;*/
        position: relative;
        padding-left: 25px;
        margin-bottom: 12px;
        cursor: pointer;
        font-size: 14px;
    }

        .lbw-checkbox-wrapper.lbw-red input
        .lbw-radiobutton-wrapper.lbw-red input {
            position: absolute;
            opacity: 0;
            cursor: pointer;
            height: 0;
            width: 0;
        }

        .lbw-checkbox-wrapper.lbw-red .checkmark,
        .lbw-radiobutton-wrapper.lbw-red .checkmark {
            position: absolute;
            top: 0;
            left: 0;
            height: 16px;
            width: 16px;
            background-color: transparent;
            border: 1px solid var(--red-8);
            border-radius: 4px
        }

        .lbw-checkbox-wrapper.lbw-red:hover input ~ .checkmark,
        .lbw-radiobutton-wrapper.lbw-red:hover input ~ .checkmark {
            background-color: var(--red-3);
        }

        .lbw-checkbox-wrapper.lbw-red input:checked ~ .checkmark,
        .lbw-radiobutton-wrapper.lbw-red input:checked ~ .checkmark {
            background-color: var(--red-8);
        }

        .lbw-checkbox-wrapper.lbw-red .checkmark:after,
        .lbw-radiobutton-wrapper.lbw-red .checkmark:after {
            content: "";
            position: absolute;
            display: none;
        }

        .lbw-checkbox-wrapper.lbw-red input:checked ~ .checkmark:after,
        .lbw-radiobutton-wrapper.lbw-red input:checked ~ .checkmark:after {
            display: block;
        }

        .lbw-checkbox-wrapper.lbw-red .checkmark:after,
        .lbw-radiobutton-wrapper.lbw-red .checkmark:after {
            left: 4.5px;
            top: 1px;
            width: 4px;
            height: 7px;
            border: solid white;
            border-width: 0 2px 2px 0;
            -webkit-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            transform: rotate(45deg);
        }

    /*************** Checkbox - GrayPale(gp) ***************/
    .lbw-checkbox-wrapper.lbw-gp
    .lbw-radiobutton-wrapper.lbw-gp {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        /*display: block;*/
        position: relative;
        padding-left: 25px;
        margin-bottom: 12px;
        cursor: pointer;
        font-size: 14px;
    }

    .lbw-checkbox-wrapper.lbw-gp input,
    .lbw-radiobutton-wrapper.lbw-gp input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

    .lbw-checkbox-wrapper.lbw-gp .checkmark,
    .lbw-radiobutton-wrapper.lbw-gp .checkmark {
        position: absolute;
        top: 0;
        left: 0;
        height: 16px;
        width: 16px;
        background-color: transparent;
        border: 1px solid var(--gray-pale-7);
        border-radius: 4px
    }

    .lbw-checkbox-wrapper.lbw-gp:hover input ~ .checkmark,
    .lbw-radiobutton-wrapper.lbw-gp:hover input ~ .checkmark {
        background-color: var(--gray-pale-2);
    }

    .lbw-checkbox-wrapper.lbw-gp input:checked ~ .checkmark,
    .lbw-radiobutton-wrapper.lbw-gp input:checked ~ .checkmark {
        background-color: var(--gray-pale-7);
    }

    .lbw-checkbox-wrapper.lbw-gp .checkmark:after,
    .lbw-radiobutton-wrapper.lbw-gp .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }

    .lbw-checkbox-wrapper.lbw-gp input:checked ~ .checkmark:after,
    .lbw-radiobutton-wrapper.lbw-gp input:checked ~ .checkmark:after {
        display: block;
    }

    .lbw-checkbox-wrapper.lbw-gp .checkmark:after,
    .lbw-radiobutton-wrapper.lbw-gp .checkmark:after {
        left: 4.5px;
        top: 1px;
        width: 4px;
        height: 7px;
        border: solid white;
        border-width: 0 2px 2px 0;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    /*************** Checkbox & Radio Button Label***************/
    .lbw-checkbox-wrapper .wrapper-label,
    .lbw-radiobutton-wrapper .wrapper-label {
        margin-left: 7px;
        color: var(--gray-pale-7);
    }

    .lbw-checkbox-wrapper.lbw-disabled .wrapper-label,
    .lbw-radiobutton-wrapper.lbw-disabled .wrapper-label {
        margin-left: 7px;
        color: var(--gray-pale-5);
    }

/*************** Checkbox svg - Default ***************/
.lbw-check-box-18 > g > g,
.lbw-check-box-24 > g > g {
    stroke: var(--gray-pale-7);
    fill: none;
}

.lbw-check-box-18 .ckeckbox,
.lbw-check-box-24 .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18 .dash,
.lbw-check-box-24 .dash {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-disabled > g > g,
.lbw-check-box-24.lbw-disabled > g > g {
    stroke: var(--gray-pale-2);
    fill: none;
}

.lbw-check-box-18.lbw-disabled .ckeckbox,
.lbw-check-box-24.lbw-disabled .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-disabled .dash,
.lbw-check-box-24.lbw-disabled .dash {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-indeterm > g > g,
.lbw-check-box-24.lbw-indeterm > g > g {
    stroke: var(--gray-pale-7);
    fill: none;
}

.lbw-check-box-18.lbw-indeterm .ckeckbox,
.lbw-check-box-24.lbw-indeterm .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-indeterm .dash,
.lbw-check-box-24.lbw-indeterm .dash {
    stroke: var(--gray-pale-7);
    fill: none
}

.lbw-check-box-18.lbw-indeterm.lbw-disabled > g > g,
.lbw-check-box-24.lbw-indeterm.lbw-disabled > g > g {
    stroke: var(--gray-pale-2);
    fill: none;
}

.lbw-check-box-18.lbw-indeterm.lbw-disabled .ckeckbox,
.lbw-check-box-24.lbw-indeterm.lbw-disabled .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-indeterm.lbw-disabled .dash,
.lbw-check-box-24.lbw-indeterm.lbw-disabled .dash {
    stroke: var(--gray-pale-2);
    fill: none
}

.lbw-check-box-18.lbw-selected > g > g,
.lbw-check-box-24.lbw-selected > g > g {
    stroke: var(--gray-pale-7);
    fill: none;
}

.lbw-check-box-18.lbw-selected .ckeckbox,
.lbw-check-box-24.lbw-selected .ckeckbox {
    stroke: var(--gray-pale-7);
    fill: none
}

.lbw-check-box-18.lbw-selected .dash,
.lbw-check-box-24.lbw-selected .dash {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-selected.lbw-disabled > g > g,
.lbw-check-box-24.lbw-selected.lbw-disabled > g > g {
    stroke: var(--gray-pale-2);
    fill: none;
}

.lbw-check-box-18.lbw-selected.lbw-disabled .ckeckbox,
.lbw-check-box-24.lbw-selected.lbw-disabled .ckeckbox {
    stroke: var(--gray-pale-2);
    fill: none
}

.lbw-check-box-18.lbw-selected.lbw-disabled .dash,
.lbw-check-box-24.lbw-selected.lbw-disabled .dash {
    stroke: transparent;
    fill: none
}

/*************** Checkbox svg - Red ***************/
.lbw-check-box-18.lbw-red > g > g,
.lbw-check-box-24.lbw-red > g > g {
    stroke: var(--red-8);
    fill: none;
}

.lbw-check-box-18.lbw-red .ckeckbox,
.lbw-check-box-24.lbw-red .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-red .dash,
.lbw-check-box-24.lbw-red .dash {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-red.lbw-disabled > g > g,
.lbw-check-box-24.lbw-red.lbw-disabled > g > g {
    stroke: var(--red-3);
    fill: none;
}

.lbw-check-box-18.lbw-red.lbw-disabled .ckeckbox,
.lbw-check-box-24.lbw-red.lbw-disabled .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-red.lbw-disabled .dash,
.lbw-check-box-24.lbw-red.lbw-disabled .dash {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-red.lbw-indeterm > g > g,
.lbw-check-box-24.lbw-red.lbw-indeterm > g > g {
    stroke: var(--red-8);
    fill: var(--red-8);
}

.lbw-check-box-18.lbw-red.lbw-indeterm .ckeckbox,
.lbw-check-box-24.lbw-red.lbw-indeterm .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-red.lbw-indeterm .dash,
.lbw-check-box-24.lbw-red.lbw-indeterm .dash {
    stroke: white;
    fill: none
}

.lbw-check-box-18.lbw-indeterm.lbw-disabled > g > g,
.lbw-check-box-24.lbw-indeterm.lbw-disabled > g > g {
    stroke: var(--red-3);
    fill: none;
}

.lbw-check-box-18.lbw-red.lbw-indeterm.lbw-disabled .ckeckbox,
.lbw-check-box-24.lbw-red.lbw-indeterm.lbw-disabled .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-red.lbw-indeterm.lbw-disabled .dash,
.lbw-check-box-24.lbw-red.lbw-indeterm.lbw-disabled .dash {
    stroke: var(--red-3);
    fill: none
}

.lbw-check-box-18.lbw-red.lbw-selected > g > g,
.lbw-check-box-24.lbw-red.lbw-selected > g > g {
    stroke: var(--red-8);
    fill: var(--red-8);
}

.lbw-check-box-18.lbw-red.lbw-selected .ckeckbox,
.lbw-check-box-24.lbw-red.lbw-selected .ckeckbox {
    /*stroke: var(--red-8);*/
    stroke: white;
    fill: none
}

.lbw-check-box-18.lbw-red.lbw-selected .dash,
.lbw-check-box-24.lbw-red.lbw-selected .dash {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-red.lbw-selected.lbw-disabled > g > g,
.lbw-check-box-24.lbw-red.lbw-selected.lbw-disabled > g > g {
    stroke: var(--red-3);
    fill: none;
}

.lbw-check-box-18.lbw-red.lbw-selected.lbw-disabled .ckeckbox,
.lbw-check-box-24.lbw-red.lbw-selected.lbw-disabled .ckeckbox {
    stroke: var(--red-3);
    fill: none
}

.lbw-check-box-18.lbw-red.lbw-selected.lbw-disabled .dash,
.lbw-check-box-24.lbw-red.lbw-selected.lbw-disabled .dash {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-btn-red .ckeckbox,
.lbw-check-box-24.lbw-btn-red .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-btn-red .dash,
.lbw-check-box-24.lbw-btn-red .dash {
    stroke: transparent;
    fill: none
}

/*************** Checkbox svg - GrayPale(gp) ***************/
.lbw-check-box-18.lbw-gp > g > g,
.lbw-check-box-24.lbw-gp > g > g,
.lbw-radio-button-18.lbw-gp > g > g,
.lbw-radio-button-24.lbw-gp > g > g {
    stroke: var(--gray-pale-7);
    fill: none;
}

.lbw-check-box-18.lbw-gp .ckeckbox,
.lbw-check-box-24.lbw-gp .ckeckbox,
.lbw-radio-button-18.lbw-gp .ckeckbox,
.lbw-radio-button-24.lbw-gp .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-gp .dash,
.lbw-check-box-24.lbw-gp .dash,
.lbw-radio-button-18.lbw-gp .dash,
.lbw-radio-button-24.lbw-gp .dash {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-gp.lbw-disabled > g > g,
.lbw-check-box-24.lbw-gp.lbw-disabled > g > g,
.lbw-radio-button-18.lbw-gp.lbw-disabled > g > g,
.lbw-radio-button-24.lbw-gp.lbw-disabled > g > g {
    stroke: var(--gray-pale-3);
    fill: none;
}

.lbw-check-box-18.lbw-gp.lbw-disabled .ckeckbox,
.lbw-check-box-24.lbw-gp.lbw-disabled .ckeckbox,
.lbw-radio-button-18.lbw-gp.lbw-disabled .ckeckbox,
.lbw-radio-button-24.lbw-gp.lbw-disabled .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-gp.lbw-disabled .dash,
.lbw-check-box-24.lbw-gp.lbw-disabled .dash,
.lbw-radio-button-18.lbw-gp.lbw-disabled .dash,
.lbw-radio-button-24.lbw-gp.lbw-disabled .dash {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-gp.lbw-indeterm > g > g,
.lbw-check-box-24.lbw-gp.lbw-indeterm > g > g,
.lbw-radio-button-18.lbw-gp.lbw-indeterm > g > g,
.lbw-radio-button-24.lbw-gp.lbw-indeterm > g > g {
    stroke: var(--gray-pale-7);
    fill: var(--gray-pale-7);
}

.lbw-check-box-18.lbw-gp.lbw-indeterm .ckeckbox,
.lbw-check-box-24.lbw-gp.lbw-indeterm .ckeckbox,
.lbw-radio-button-18.lbw-gp.lbw-indeterm .ckeckbox,
.lbw-radio-button-24.lbw-gp.lbw-indeterm .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-gp.lbw-indeterm .dash,
.lbw-check-box-24.lbw-gp.lbw-indeterm .dash,
.lbw-radio-button-18.lbw-gp.lbw-indeterm .dash,
.lbw-radio-button-24.lbw-gp.lbw-indeterm .dash {
    stroke: white;
    fill: none
}

.lbw-check-box-18.lbw-indeterm.lbw-disabled > g > g,
.lbw-check-box-24.lbw-indeterm.lbw-disabled > g > g,
.lbw-radio-button-18.lbw-indeterm.lbw-disabled > g > g,
.lbw-radio-button-24.lbw-indeterm.lbw-disabled > g > g {
    stroke: var(--gray-pale-2);
    fill: none;
}

.lbw-check-box-18.lbw-gp.lbw-indeterm.lbw-disabled .ckeckbox,
.lbw-check-box-24.lbw-gp.lbw-indeterm.lbw-disabled .ckeckbox,
.lbw-radio-button-18.lbw-gp.lbw-indeterm.lbw-disabled .ckeckbox,
.lbw-radio-button-24.lbw-gp.lbw-indeterm.lbw-disabled .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-gp.lbw-indeterm.lbw-disabled .dash,
.lbw-check-box-24.lbw-gp.lbw-indeterm.lbw-disabled .dash,
.lbw-radio-button-18.lbw-gp.lbw-indeterm.lbw-disabled .dash,
.lbw-radio-button-24.lbw-gp.lbw-indeterm.lbw-disabled .dash {
    stroke: var(--gray-pale-2);
    fill: none
}

.lbw-check-box-18.lbw-gp.lbw-selected > g > g,
.lbw-check-box-24.lbw-gp.lbw-selected > g > g,
.lbw-radio-button-18.lbw-gp.lbw-selected > g > g,
.lbw-radio-button-24.lbw-gp.lbw-selected > g > g {
    stroke: var(--gray-pale-7);
    fill: var(--gray-pale-7);
}

.lbw-check-box-18.lbw-gp.lbw-selected .ckeckbox,
.lbw-check-box-24.lbw-gp.lbw-selected .ckeckbox,
.lbw-radio-button-18.lbw-gp.lbw-selected .ckeckbox,
.lbw-radio-button-24.lbw-gp.lbw-selected .ckeckbox {
    /*stroke: var(--red-8);*/
    stroke: white;
    fill: none
}

.lbw-check-box-18.lbw-gp.lbw-selected .dash,
.lbw-check-box-24.lbw-gp.lbw-selected .dash,
.lbw-radio-button-18.lbw-gp.lbw-selected .dash,
.lbw-radio-button-24.lbw-gp.lbw-selected .dash {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-gp.lbw-selected.lbw-disabled > g > g,
.lbw-check-box-24.lbw-gp.lbw-selected.lbw-disabled > g > g,
.lbw-radio-button-18.lbw-gp.lbw-selected.lbw-disabled > g > g,
.lbw-radio-button-24.lbw-gp.lbw-selected.lbw-disabled > g > g {
    stroke: var(--gray-pale-4);
    /*fill: none;*/
    fill: var(--gray-pale-2);
}

.lbw-check-box-18.lbw-gp.lbw-selected.lbw-disabled .ckeckbox,
.lbw-check-box-24.lbw-gp.lbw-selected.lbw-disabled .ckeckbox,
.lbw-radio-button-18.lbw-gp.lbw-selected.lbw-disabled .ckeckbox,
.lbw-radio-button-24.lbw-gp.lbw-selected.lbw-disabled .ckeckbox {
    /*stroke: var(--gray-pale-4);*/
    stroke: transparent;
    fill: #fff
}

.lbw-check-box-18.lbw-gp.lbw-selected.lbw-disabled .dash,
.lbw-check-box-24.lbw-gp.lbw-selected.lbw-disabled .dash,
.lbw-radio-button-18.lbw-gp.lbw-selected.lbw-disabled .dash,
.lbw-radio-button-24.lbw-gp.lbw-selected.lbw-disabled .dash {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-btn-gp .ckeckbox,
.lbw-check-box-24.lbw-btn-gp .ckeckbox,
.lbw-radio-button-18.lbw-btn-gp .ckeckbox,
.lbw-radio-button-24.lbw-btn-gp .ckeckbox {
    stroke: transparent;
    fill: none
}

.lbw-check-box-18.lbw-btn-gp .dash,
.lbw-check-box-24.lbw-btn-gp .dash,
.lbw-radio-button-18.lbw-btn-gp .dash,
.lbw-radio-button-24.lbw-btn-gp .dash {
    stroke: transparent;
    fill: none
}


/*************** RadioButton svg - Default(GrayPale(gp)) ***************/
.lbw-radio-button-18 > .circle-border,
.lbw-radio-button-24 > .circle-border {
    stroke: none;
    fill: var(--gray-pale-7);
}

.lbw-radio-button-18 > .circle-outer,
.lbw-radio-button-24 > .circle-outer,
.lbw-radio-button-18 > .circle-inner,
.lbw-radio-button-24 > .circle-inner {
    stroke: #fff;
    fill: #fff;
}

.lbw-radio-button-18.lbw-disabled > .circle-border,
.lbw-radio-button-24.lbw-disabled > .circle-border {
    stroke: none;
    fill: var(--gray-pale-4);
}

.lbw-radio-button-18.lbw-disabled > .circle-outer,
.lbw-radio-button-24.lbw-disabled > .circle-outer,
.lbw-radio-button-18.lbw-disabled > .circle-inner,
.lbw-radio-button-24.lbw-disabled > .circle-inner {
    stroke: #fff;
    fill: #fff;
}

.lbw-radio-button-18.lbw-selected > .circle-border,
.lbw-radio-button-24.lbw-selected > .circle-border,
.lbw-radio-button-18.lbw-selected > .circle-outer,
.lbw-radio-button-24.lbw-selected > .circle-outer {
    stroke: none;
    fill: var(--gray-pale-7);
}

.lbw-radio-button-18.lbw-selected > .circle-inner,
.lbw-radio-button-24.lbw-selected > .circle-inner {
    stroke: #fff;
    fill: #fff;
}

.lbw-radio-button-18.lbw-selected.lbw-disabled > .circle-border,
.lbw-radio-button-24.lbw-selected.lbw-disabled > .circle-border,
.lbw-radio-button-18.lbw-selected.lbw-disabled > .circle-outer,
.lbw-radio-button-24.lbw-selected.lbw-disabled > .circle-outer {
    stroke: none;
    fill: var(--gray-pale-4);
}

.lbw-radio-button-18.lbw-selected.lbw-disabled > .circle-inner,
.lbw-radio-button-24.lbw-selected.lbw-disabled > .circle-inner {
    stroke: #fff;
    fill: #fff;
}

/*************** RadioButton svg - Red ***************/
.lbw-radio-button-18.lbw-red > .circle-border,
.lbw-radio-button-24.lbw-red > .circle-border {
    stroke: none;
    fill: var(--red-8);
}

.lbw-radio-button-18.lbw-red > .circle-outer,
.lbw-radio-button-24.lbw-red > .circle-outer,
.lbw-radio-button-18.lbw-red > .circle-inner,
.lbw-radio-button-24.lbw-red > .circle-inner {
    stroke: #fff;
    fill: #fff;
}

.lbw-radio-button-18.lbw-red.lbw-disabled > .circle-border,
.lbw-radio-button-24.lbw-red.lbw-disabled > .circle-border {
    stroke: none;
    fill: var(--red-3);
}

.lbw-radio-button-18.lbw-red.lbw-disabled > .circle-outer,
.lbw-radio-button-24.lbw-red.lbw-disabled > .circle-outer,
.lbw-radio-button-18.lbw-red.lbw-disabled > .circle-inner,
.lbw-radio-button-24.lbw-red.lbw-disabled > .circle-inner {
    stroke: #fff;
    fill: #fff;
}

.lbw-radio-button-18.lbw-red.lbw-selected > .circle-border,
.lbw-radio-button-24.lbw-red.lbw-selected > .circle-border,
.lbw-radio-button-18.lbw-red.lbw-selected > .circle-outer,
.lbw-radio-button-24.lbw-red.lbw-selected > .circle-outer {
    stroke: none;
    fill: var(--red-8);
}

.lbw-radio-button-18.lbw-red.lbw-selected > .circle-inner,
.lbw-radio-button-24.lbw-red.lbw-selected > .circle-inner {
    stroke: #fff;
    fill: #fff;
}

.lbw-radio-button-18.lbw-red.lbw-selected.lbw-disabled > .circle-border,
.lbw-radio-button-24.lbw-red.lbw-selected.lbw-disabled > .circle-border,
.lbw-radio-button-18.lbw-red.lbw-selected.lbw-disabled > .circle-outer,
.lbw-radio-button-24.lbw-red.lbw-selected.lbw-disabled > .circle-outer {
    stroke: none;
    fill: var(--red-3);
}

.lbw-radio-button-18.lbw-red.lbw-selected.lbw-disabled > .circle-inner,
.lbw-radio-button-24.lbw-red.lbw-selected.lbw-disabled > .circle-inner {
    stroke: #fff;
    fill: #fff;
}

/*************** DateRangePicker ***************/
.lbw-daterangepicker-wrapper .e-input-group.e-control-wrapper.e-date-range-wrapper {
    height: 58px;
    border-radius: 10px;
    border: solid 1px #b3bbc5;
    background-color: #fff;
    box-shadow: none;
    outline: none;
}

    .lbw-daterangepicker-wrapper .e-input-group.e-control-wrapper.e-date-range-wrapper .lbw-daterangepicker {
        height: 100%;
        width: 100%;
        padding: 0 50px 0 20px;
        color: #4b4f5a;
        font-size: 16px;
        outline: none;
        border: none;
        background-color: transparent;
    }

    .lbw-daterangepicker-wrapper .e-input-group.e-control-wrapper.e-date-range-wrapper .e-clear-icon {
        min-width: 0
    }

        .lbw-daterangepicker-wrapper .e-input-group.e-control-wrapper.e-date-range-wrapper .e-clear-icon:before {
            display: none;
            min-width: 0
        }

    .lbw-daterangepicker-wrapper .e-input-group.e-control-wrapper.e-date-range-wrapper .e-input-group-icon.e-range-icon.e-icons {
        position: absolute;
        background-image: url(/Contents/Images/SetupSubscriptionSettings/calendar.png);
        background-repeat: no-repeat;
        background-position: center center;
        background-size: contain;
        right: 20px;
        top: 12px;
        width: 24px;
        height: 24px;
        border: none;
        background-color: transparent;
        box-shadow: none;
    }

        .lbw-daterangepicker-wrapper .e-input-group.e-control-wrapper.e-date-range-wrapper .e-input-group-icon.e-range-icon.e-icons:before {
            content: '';
        }

.e-daterangepicker.e-popup .e-presets .e-list-item {
    background-color: #fff;
    color: var(--gray-pale-7);
}

    .e-daterangepicker.e-popup .e-presets .e-list-item.e-hover {
        background-color: #fff;
        color: var(--gray-pale-7);
    }

    .e-daterangepicker.e-popup .e-presets .e-list-item.e-active {
        background-color: #fff;
        color: var(--red-8);
    }

.e-calendar .e-content td.e-today span.e-day {
    background: #fff;
    border: 1px solid var(--red-8);
    border-radius: 4px;
    color: var(--red-8);
}

.e-calendar .e-content td.e-today.e-selected:hover span.e-day, .e-calendar .e-content td.e-selected:hover span.e-day, .e-calendar .e-content td.e-selected.e-focused-date span.e-day, .e-bigger.e-small .e-calendar .e-content td.e-today.e-selected:hover span.e-day, .e-bigger.e-small .e-calendar .e-content td.e-selected:hover span.e-day, .e-bigger.e-small .e-calendar .e-content td.e-selected.e-focused-date span.e-day {
    background-color: var(--red-8);
    color: #fff;
}

.e-calendar .e-content td.e-selected span.e-day, .e-bigger.e-small .e-calendar .e-content td.e-selected span.e-day {
    background-color: var(--red-8);
    border: 1px solid transparent;
    border-radius: 4px;
    color: #fff;
}

.e-daterangepicker.e-popup .e-calendar .e-content .e-range-hover, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-content .e-range-hover {
    background-color: var(--red-2);
    color: #212529;
}

    .e-daterangepicker.e-popup .e-calendar .e-content .e-range-hover span, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-content .e-range-hover span {
        background-color: var(--red-2);
        border: none;
        color: var(--red-8);
    }

.e-daterangepicker.e-popup .e-calendar .e-content.e-month .e-today.e-range-hover span, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-content.e-month .e-today.e-range-hover span {
    background-color: var(--red-2);
    border: 1px solid var(--red-8);
    color: var(--red-8);
}

.e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover span.e-day, .e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover span.e-day {
    background-color: var(--red-8);
    color: #fff;
}

.e-daterangepicker.e-popup .e-calendar .e-range-hover:not(.e-selected):hover span.e-day, .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-focused-date:not(.e-selected) span.e-day, .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-focused-date.e-today span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-range-hover:not(.e-selected):hover span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-focused-date:not(.e-selected) span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-focused-date.e-today span.e-day {
    background-color: var(--red-2);
    border: none;
    color: var(--red-8);
}

.e-btn.e-flat.e-primary, .e-css.e-btn.e-flat.e-primary {
    background-color: var(--red-8);
    border-color: var(--red-8);
    color: #fff;
}

.e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error), .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
    border-color: var(--red-2);
    box-shadow: 0 0 0 3px var(--red-1);
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.e-input-group:not(.e-disabled):active:not(.e-success):not(.e-warning):not(.e-error), .e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-success):not(.e-warning):not(.e-error) {
    border-color: var(--red-2);
    box-shadow: 0 0 0 3px var(--red-1);
}

.e-input-group.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
.e-input-group.e-control-wrapper.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
.e-float-input.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
.e-float-input.e-control-wrapper.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
.e-float-input.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) input:not([disabled]),
.e-float-input.e-control-wrapper.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) input:not([disabled]),
.e-float-input.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) textarea:not([disabled]),
.e-float-input.e-control-wrapper.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) textarea:not([disabled]) {
    border-color: var(--red-2);
}

.e-daterangepicker.e-popup .e-calendar .e-range-hover.e-today:hover span.e-day, .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-focused-date.e-today span.e-day, .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-start-date.e-selected.e-today span.e-day, .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-end-date.e-selected.e-today span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-today:hover span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-focused-date.e-today span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-start-date.e-selected.e-today span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-end-date.e-selected.e-today span.e-day {
    border: 1px solid var(--red-8);
}

.e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover.e-today span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover.e-today span.e-day {
    background-color: var(--red-8);
    color: #fff;
}

.e-calendar .e-content td.e-today.e-selected span.e-day, .e-bigger.e-small .e-calendar .e-content td.e-today.e-selected span.e-day {
    background-color: var(--red-8);
    border: 1px solid var(--red-8);
    box-shadow: none;
    color: #fff;
}

.e-btn.e-flat.e-primary:hover, .e-css.e-btn.e-flat.e-primary:hover {
    background-color: var(--red-8);
    border-color: var(--red-8);
    color: #fff;
}

.e-btn.e-flat.e-primary:disabled, .e-css.e-btn.e-flat.e-primary:disabled {
    background-color: var(--red-8);
    border-color: transparent;
    box-shadow: none;
    color: #fff;
}

.e-btn.e-flat.e-primary:active, .e-btn.e-flat.e-primary.e-active, .e-css.e-btn.e-flat.e-primary:active, .e-css.e-btn.e-flat.e-primary.e-active {
    background-color: var(--red-8);
    border-color: var(--red-8);
    color: #fff;
    box-shadow: 0 0 0 0.25em rgb(151 27 47 / 50%);
}

.e-ddl.e-control.e-popup .e-list-parent.e-ul .e-list-item:hover {
    background-color: var(--red-2);
}

.e-ddl.e-control.e-popup .e-list-parent.e-ul .e-list-item.e-active {
    background-color: var(--red-8);
}

.btn_common {
    border-radius: 8px !important;
    height: 36px;
}

    .btn_common.btn_clear {
        background-color: var(--red-8) !important;
        border: none !important;
        color: #fff !important;
    }
