/* 루트 */
:root{
    --breakpoint-xs: 0;
    --breakpoint-sm: 575px;
    --breakpoint-md: 767px;
    --breakpoint-lg: 991px;
    --breakpoint-xl: 1200px;
    --pixel-0: 0px;
    --pixel-1: 1px;
    --pixel-2: 2px;
    --pixel-3: 3px;
    --pixel-4: 4px;
    --pixel-5: 5px;
    --pixel-6: 6px;
    --pixel-7: 7px;
    --pixel-8: 8px;
    --pixel-9: 9px;
    --pixel-10: 10px;
    --pixel-11: 11px;
    --pixel-12: 12px;
    --pixel-13: 13px;
    --pixel-14: 14px;
    --pixel-15: 15px;
    --pixel-16: 16px;
    --pixel-17: 17px;
    --pixel-18: 18px;
    --pixel-19: 19px;
    --pixel-20: 20px;
    --pixel-22: 22px;
    --pixel-24: 24px;
    --pixel-25: 25px;
    --pixel-26: 26px;
    --pixel-28: 28px;
    --pixel-30: 30px;
    --pixel-32: 32px;
    --pixel-34: 34px;
    --pixel-35: 35px;
    --pixel-36: 36px;
    --pixel-38: 38px;
    --pixel-40: 40px;
    --pixel-42: 42px;
    --pixel-44: 44px;
    --pixel-45: 45px;
    --pixel-46: 46px;
    --pixel-48: 48px;
    --pixel-50: 50px;
    --pixel-52: 52px;
    --pixel-54: 54px;
    --pixel-55: 55px;
    --pixel-56: 56px;
    --pixel-58: 58px;
    --pixel-60: 60px;
    --pixel-62: 62px;
    --pixel-64: 64px;
    --pixel-65: 65px;
    --pixel-66: 66px;
    --pixel-68: 68px;
    --pixel-70: 70px;
    --pixel-72: 72px;
    --pixel-74: 74px;
    --pixel-75: 75px;
    --pixel-76: 76px;
    --pixel-78: 78px;
    --pixel-80: 80px;
    --pixel-82: 82px;
    --pixel-84: 84px;
    --pixel-85: 85px;
    --pixel-86: 86px;
    --pixel-88: 88px;
    --pixel-90: 90px;
    --pixel-92: 92px;
    --pixel-94: 94px;
    --pixel-95: 95px;
    --pixel-96: 96px;
    --pixel-98: 98px;
    --pixel-100: 100px;
    --pixel-m-0: -0px;
    --pixel-m-1: -1px;
    --pixel-m-2: -2px;
    --pixel-m-3: -3px;
    --pixel-m-4: -4px;
    --pixel-m-5: -5px;
    --pixel-m-6: -6px;
    --pixel-m-7: -7px;
    --pixel-m-8: -8px;
    --pixel-m-9: -9px;
    --pixel-m-10: -10px;
    --pixel-m-11: -11px;
    --pixel-m-12: -12px;
    --pixel-m-13: -13px;
    --pixel-m-14: -14px;
    --pixel-m-15: -15px;
    --pixel-m-16: -16px;
    --pixel-m-17: -17px;
    --pixel-m-18: -18px;
    --pixel-m-19: -19px;
    --pixel-m-20: -20px;
    --pixel-m-22: -22px;
    --pixel-m-24: -24px;
    --pixel-m-25: -25px;
    --pixel-m-26: -26px;
    --pixel-m-28: -28px;
    --pixel-m-30: -30px;
    --pixel-m-32: -32px;
    --pixel-m-34: -34px;
    --pixel-m-35: -35px;
    --pixel-m-36: -36px;
    --pixel-m-38: -38px;
    --pixel-m-40: -40px;
    --pixel-m-42: -42px;
    --pixel-m-44: -44px;
    --pixel-m-45: -45px;
    --pixel-m-46: -46px;
    --pixel-m-48: -48px;
    --pixel-m-50: -50px;
    --pixel-m-52: -52px;
    --pixel-m-54: -54px;
    --pixel-m-55: -55px;
    --pixel-m-56: -56px;
    --pixel-m-58: -58px;
    --pixel-m-60: -60px;
    --pixel-m-62: -62px;
    --pixel-m-64: -64px;
    --pixel-m-65: -65px;
    --pixel-m-66: -66px;
    --pixel-m-68: -68px;
    --pixel-m-70: -70px;
    --pixel-m-72: -72px;
    --pixel-m-74: -74px;
    --pixel-m-75: -75px;
    --pixel-m-76: -76px;
    --pixel-m-78: -78px;
    --pixel-m-80: -80px;
    --pixel-m-82: -82px;
    --pixel-m-84: -84px;
    --pixel-m-85: -85px;
    --pixel-m-86: -86px;
    --pixel-m-88: -88px;
    --pixel-m-90: -90px;
    --pixel-m-92: -92px;
    --pixel-m-94: -94px;
    --pixel-m-95: -95px;
    --pixel-m-96: -96px;
    --pixel-m-98: -98px;
    --pixel-m-100: -100px;
}

/* 색상 */
:root{
    --color-disabled: #f1f1f1;
    --color-active: #3C81F1;
    --color-active2: #113198;
    --color-active3: #051957;
    --color-light-active: #adc8f5;
    --color-hover: #b92f35;
    --color-blue: #0d6efd;
    --color-indigo: #160f93;
    --color-purple: #6f42c1;
    --color-pink: #d63384;
    --color-red: #EF4444;
    --color-orange: #fd7e14;
    --color-yellow: #ffc107;
    --color-green: #198754;
    --color-teal: #20c997;
    --color-cyan: #0dcaf0;
    --color-white: #fff;
    --color-black: #000;
    --color-warning: #ffc107;
    --color-success: #1dd347;
    --color-danger-100: #FFD8D8;
    --color-danger-200: #ff0000;
    --color-gray-100: #FAFAFA;
    --color-gray-200: #F5F5F5;
    --color-gray-300: #EEEEEE;
    --color-gray-400: #DDDDDD;
    --color-gray-500: #CCCCCC;
    --color-gray-600: #AAAAAA;
    --color-gray-700: #888888;
    --color-gray-800: #666666;
    --color-gray-900: #444444;
    --color-black-100: #727272;
    --color-black-200: #5e5e5e;
    --color-black-300: #494949;
    --color-black-400: #353535;
    --color-black-500: #212121;
    --color-black-600: #0c0c0c;
    --color-black-700: #000000;
}

/* 필터색상 */
:root{
    --filter-black: invert(0%) sepia(100%) saturate(0%) hue-rotate(15deg) brightness(101%) contrast(101%);
    --filter-white: invert(100%) sepia(0%) saturate(0%) hue-rotate(254deg) brightness(100%) contrast(106%);
    --filter-gray-100: invert(97%) sepia(6%) saturate(1054%) hue-rotate(67deg) brightness(117%) contrast(95%);
    --filter-gray-200: invert(100%) sepia(2%) saturate(688%) hue-rotate(252deg) brightness(118%) contrast(87%);
    --filter-gray-300: invert(90%) sepia(2%) saturate(2556%) hue-rotate(196deg) brightness(109%) contrast(80%);
    --filter-gray-400: invert(97%) sepia(3%) saturate(948%) hue-rotate(179deg) brightness(88%) contrast(93%);
    --filter-gray-500: invert(58%) sepia(97%) saturate(11%) hue-rotate(19deg) brightness(104%) contrast(105%);
    --filter-gray-600: invert(70%) sepia(0%) saturate(416%) hue-rotate(168deg) brightness(88%) contrast(81%);
    --filter-gray-700: invert(43%) sepia(12%) saturate(8%) hue-rotate(356deg) brightness(100%) contrast(86%);
    --filter-gray-800: invert(33%) sepia(0%) saturate(27%) hue-rotate(171deg) brightness(91%) contrast(90%);
    --filter-gray-900: invert(16%) sepia(1%) saturate(1500%) hue-rotate(93deg) brightness(91%) contrast(83%);
    --filter-black-100: invert(46%) sepia(0%) saturate(2205%) hue-rotate(26deg) brightness(97%) contrast(81%);
    --filter-black-200: invert(37%) sepia(0%) saturate(1539%) hue-rotate(235deg) brightness(93%) contrast(84%);
    --filter-black-300: invert(24%) sepia(3%) saturate(24%) hue-rotate(329deg) brightness(102%) contrast(86%);
    --filter-black-400: invert(11%) sepia(0%) saturate(5084%) hue-rotate(52deg) brightness(103%) contrast(75%);
    --filter-black-500: invert(8%) sepia(14%) saturate(12%) hue-rotate(83deg) brightness(97%) contrast(89%);
    --filter-black-600: invert(8%) sepia(14%) saturate(12%) hue-rotate(83deg) brightness(97%) contrast(89%);
    --filter-black-700: invert(0%) sepia(95%) saturate(14%) hue-rotate(195deg) brightness(92%) contrast(100%);
    --filter-active-100: invert(43%) sepia(37%) saturate(4026%) hue-rotate(202deg) brightness(100%) contrast(90%);
    --filter-active-200: invert(8%) sepia(55%) saturate(4666%) hue-rotate(354deg) brightness(96%) contrast(95%);
    --filter-active-300: invert(8%) sepia(34%) saturate(6994%) hue-rotate(345deg) brightness(84%) contrast(106%);
}

.col-12 {width:100% !important;}

.bdr0 {border-radius:var(--pixel-0) !important;}
.bdr8 {border-radius:var(--pixel-8) !important;}

.pb0 {padding-bottom:var(--pixel-0) !important;}
.pb10 {padding-bottom:var(--pixel-10) !important;}
.pb16 {padding-bottom:var(--pixel-16) !important;}

.pt0 {padding-top:var(--pixel-0) !important;}

.px8 {padding-left:var(--pixel-8) !important; padding-right:var(--pixel-8) !important;}
.px16 {padding-left:var(--pixel-16) !important; padding-right:var(--pixel-16) !important;}
.px24 {padding-left:var(--pixel-24) !important; padding-right:var(--pixel-24) !important;}
.px32 {padding-left:var(--pixel-32) !important; padding-right:var(--pixel-32) !important;}

.py4 {padding-top:var(--pixel-4) !important; padding-bottom:var(--pixel-4) !important;}
.py8 {padding-top:var(--pixel-8) !important; padding-bottom:var(--pixel-8) !important;}
.py16 {padding-top:var(--pixel-16) !important; padding-bottom:var(--pixel-16) !important;}

.mb32 {margin-bottom:var(--pixel-32) !important;}

.mr4 {margin-right:var(--pixel-4) !important;}
.mr5 {margin-right:var(--pixel-5) !important;}
.mr8 {margin-right:var(--pixel-8) !important;}

.mt8 {margin-top:var(--pixel-8) !important;}
.mt16 {margin-top:var(--pixel-16) !important;}
.mt24 {margin-top:var(--pixel-24) !important;}
.mt30 {margin-top:var(--pixel-30) !important;}
.mt32 {margin-top:var(--pixel-32) !important;}

.mxm16 {margin-left:var(--pixel-m-16) !important; margin-right:var(--pixel-m-16) !important;}

.mtm16 {margin-top:var(--pixel-m-16) !important;}

.f16 {font-size:var(--pixel-16) !important;}

.fw3 {font-weight:300 !important;}
.fw4 {font-weight:400 !important;}
.fw5 {font-weight:500 !important;}
.fw6 {font-weight:600 !important;}
.fw7 {font-weight:700 !important;}
.fw8 {font-weight:800 !important;}
.fw9 {font-weight:900 !important;}

.f14 {font-size:var(--pixel-14) !important;}
.f15 {font-size:var(--pixel-15) !important;}
.f16 {font-size:var(--pixel-16) !important;}


.bb0 {border-bottom:0 !important;}


/* 텍스트정렬 */
.tc {text-align:center !important;}
.tl {text-align:left !important;}
.tr {text-align:right !important;}
.tj {text-align:justify !important;}
@media (max-width:1200px){
.tc-xl {text-align:center !important;}
.tl-xl {text-align:left !important;}
.tr-xl {text-align:right !important;}
.tj-xl {text-align:justify !important;}
}
@media (max-width:991px){
.tc-lg {text-align:center !important;}
.tl-lg {text-align:left !important;}
.tr-lg {text-align:right !important;}
.tj-lg {text-align:justify !important;}
}
@media (max-width:767px){
.tc-md {text-align:center !important;}
.tl-md {text-align:left !important;}
.tr-md {text-align:right !important;}
.tj-md {text-align:justify !important;}
}
@media (max-width:575px){
.tc-sm {text-align:center !important;}
.tl-sm {text-align:left !important;}
.tr-sm {text-align:right !important;}
.tj-sm {text-align:justify !important;}
}

/* 박스 */
.d-block {display:block !important;}
.d-inline-block {display:inline-block !important;}
.d-inline {display:inline !important;}
.d-hidden  {display:none !important;}

/* 플렉스박스 */
.flex {display:flex; flex-wrap:wrap !important;}
.flex-tl {justify-content:flex-start !important;}
.flex-tr {justify-content:flex-end !important;}
.flex-tc {justify-content:center !important;}
.flex-tj {justify-content:space-between !important;}
.flex-vc {align-items:center !important;}
.flex-vt {align-items:flex-start !important;}
.flex-vb {align-items:flex-end !important;}
.flex-al {align-content:flex-start !important;}
.flex-ar {align-content:flex-end !important;}
.flex-ac {align-content:center !important;}
.flex-as {align-content:space-between !important;}
.flex-dc {flex-direction:column !important;}
.flex-dcr {flex-direction:column-reverse !important;}
.flex-dr {flex-direction:row !important;}
.flex-drr {flex-direction:row-reverse !important;}

/* 폰트색상 */
.ft-disabled {color:var(--color-disabled) !important;}
.ft-active {color:var(--color-active) !important;}
.ft-active2 {color:var(--color-active2) !important;}
.ft-active3 {color:var(--color-active3) !important;}
.ft-hover {color:var(--color-hover) !important;}
.ft-blue {color:var(--color-blue) !important;}
.ft-indigo {color:var(--color-indigo) !important;}
.ft-purple {color:var(--color-purple) !important;}
.ft-pink {color:var(--color-pink) !important;}
.ft-red {color:var(--color-red) !important;}
.ft-orange {color:var(--color-orange) !important;}
.ft-yellow {color:var(--color-yellow) !important;}
.ft-green {color:var(--color-green) !important;}
.ft-teal {color:var(--color-teal) !important;}
.ft-cyan {color:var(--color-cyan) !important;}
.ft-white {color:var(--color-white) !important;}
.ft-black {color:var(--color-black) !important;}
.ft-warning {color:var(--color-warning) !important;}
.ft-success {color:var(--color-success) !important;}
.ft-danger-100 {color:var(--color-danger-100) !important;}
.ft-danger-200 {color:var(--color-danger-200) !important;}
.ft-gray-100 {color:var(--color-gray-100) !important;}
.ft-gray-200 {color:var(--color-gray-200) !important;}
.ft-gray-300 {color:var(--color-gray-300) !important;}
.ft-gray-400 {color:var(--color-gray-400) !important;}
.ft-gray-500 {color:var(--color-gray-500) !important;}
.ft-gray-600 {color:var(--color-gray-600) !important;}
.ft-gray-700 {color:var(--color-gray-700) !important;}
.ft-gray-800 {color:var(--color-gray-800) !important;}
.ft-gray-900 {color:var(--color-gray-900) !important;}
.ft-black-100 {color:var(--color-black-100) !important;}
.ft-black-200 {color:var(--color-black-200) !important;}
.ft-black-300 {color:var(--color-black-300) !important;}
.ft-black-400 {color:var(--color-black-400) !important;}
.ft-black-500 {color:var(--color-black-500) !important;}
.ft-black-600 {color:var(--color-black-600) !important;}
.ft-black-700 {color:var(--color-black-700) !important;}

/* 배경색상 */
.bg-disabled {background:var(--color-disabled) !important;}
.bg-active {background:var(--color-active) !important;}
.bg-active2 {background:var(--color-active2) !important;}
.bg-active3 {background:var(--color-active3) !important;}
.bg-hover {background:var(--color-hover) !important;}
.bg-blue {background:var(--color-blue) !important;}
.bg-indigo {background:var(--color-indigo) !important;}
.bg-purple {background:var(--color-purple) !important;}
.bg-pink {background:var(--color-pink) !important;}
.bg-red {background:var(--color-red) !important;}
.bg-orange {background:var(--color-orange) !important;}
.bg-yellow {background:var(--color-yellow) !important;}
.bg-green {background:var(--color-green) !important;}
.bg-teal {background:var(--color-teal) !important;}
.bg-cyan {background:var(--color-cyan) !important;}
.bg-white {background:var(--color-white) !important;}
.bg-black {background:var(--color-black) !important;}
.bg-warning {background:var(--color-warning) !important;}
.bg-success {background:var(--color-success) !important;}
.bg-danger-100 {background:var(--color-danger-100) !important;}
.bg-danger-200 {background:var(--color-danger-200) !important;}
.bg-gray-100 {background:var(--color-gray-100) !important;}
.bg-gray-200 {background:var(--color-gray-200) !important;}
.bg-gray-300 {background:var(--color-gray-300) !important;}
.bg-gray-400 {background:var(--color-gray-400) !important;}
.bg-gray-500 {background:var(--color-gray-500) !important;}
.bg-gray-600 {background:var(--color-gray-600) !important;}
.bg-gray-700 {background:var(--color-gray-700) !important;}
.bg-gray-800 {background:var(--color-gray-800) !important;}
.bg-gray-900 {background:var(--color-gray-900) !important;}
.bg-black-100 {background:var(--color-black-100) !important;}
.bg-black-200 {background:var(--color-black-200) !important;}
.bg-black-300 {background:var(--color-black-300) !important;}
.bg-black-400 {background:var(--color-black-400) !important;}
.bg-black-500 {background:var(--color-black-500) !important;}
.bg-black-600 {background:var(--color-black-600) !important;}
.bg-black-700 {background:var(--color-black-700) !important;}

/* 테두리색상 */
.bd-disabled {border-color:var(--color-disabled) !important;}
.bd-active {border-color:var(--color-active) !important;}
.bd-active2 {border-color:var(--color-active2) !important;}
.bd-active3 {border-color:var(--color-active3) !important;}
.bd-hover {border-color:var(--color-hover) !important;}
.bd-blue {border-color:var(--color-blue) !important;}
.bd-indigo {border-color:var(--color-indigo) !important;}
.bd-purple {border-color:var(--color-purple) !important;}
.bd-pink {border-color:var(--color-pink) !important;}
.bd-red {border-color:var(--color-red) !important;}
.bd-orange {border-color:var(--color-orange) !important;}
.bd-yellow {border-color:var(--color-yellow) !important;}
.bd-green {border-color:var(--color-green) !important;}
.bd-teal {border-color:var(--color-teal) !important;}
.bd-cyan {border-color:var(--color-cyan) !important;}
.bd-white {border-color:var(--color-white) !important;}
.bd-black {border-color:var(--color-black) !important;}
.bd-warning {border-color:var(--color-warning) !important;}
.bd-success {border-color:var(--color-success) !important;}
.bd-danger-100 {border-color:var(--color-danger-100) !important;}
.bd-danger-200 {border-color:var(--color-danger-200) !important;}
.bd-gray-100 {border-color:var(--color-gray-100) !important;}
.bd-gray-200 {border-color:var(--color-gray-200) !important;}
.bd-gray-300 {border-color:var(--color-gray-300) !important;}
.bd-gray-400 {border-color:var(--color-gray-400) !important;}
.bd-gray-500 {border-color:var(--color-gray-500) !important;}
.bd-gray-600 {border-color:var(--color-gray-600) !important;}
.bd-gray-700 {border-color:var(--color-gray-700) !important;}
.bd-gray-800 {border-color:var(--color-gray-800) !important;}
.bd-gray-900 {border-color:var(--color-gray-900) !important;}
.bd-black-100 {border-color:var(--color-black-100) !important;}
.bd-black-200 {border-color:var(--color-black-200) !important;}
.bd-black-300 {border-color:var(--color-black-300) !important;}
.bd-black-400 {border-color:var(--color-black-400) !important;}
.bd-black-500 {border-color:var(--color-black-500) !important;}
.bd-black-600 {border-color:var(--color-black-600) !important;}
.bd-black-700 {border-color:var(--color-black-700) !important;}

/* 필터색상 */
.filter-white {filter:var(--filter-white) !important;}
.filter-black {filter:var(--filter-black) !important;}
.filter-gray-100 {filter:var(--filter-gray-100) !important;}
.filter-gray-200 {filter:var(--filter-gray-200) !important;}
.filter-gray-300 {filter:var(--filter-gray-300) !important;}
.filter-gray-400 {filter:var(--filter-gray-400) !important;}
.filter-gray-500 {filter:var(--filter-gray-500) !important;}
.filter-gray-600 {filter:var(--filter-gray-600) !important;}
.filter-gray-700 {filter:var(--filter-gray-700) !important;}
.filter-gray-800 {filter:var(--filter-gray-800) !important;}
.filter-gray-900 {filter:var(--filter-gray-900) !important;}
.filter-black-100 {filter:var(--filter-black-100) !important;}
.filter-black-200 {filter:var(--filter-black-200) !important;}
.filter-black-300 {filter:var(--filter-black-300) !important;}
.filter-black-400 {filter:var(--filter-black-400) !important;}
.filter-black-500 {filter:var(--filter-black-500) !important;}
.filter-black-600 {filter:var(--filter-black-600) !important;}
.filter-black-700 {filter:var(--filter-black-700) !important;}
.filter-active-100 {filter:var(--filter-active-100) !important;}
.filter-active-200 {filter:var(--filter-active-200) !important;}
.filter-active-300 {filter:var(--filter-active-300) !important;}
.filter-hover:hover {filter:var(--filter-white) !important;}

/* 버튼색상 */
.btn-disabled {background:var(--color-disabled) !important; color:var(--color-gray-700) !important;}
.btn-active {background:var(--color-active) !important;}
.btn-active2 {background:var(--color-active2) !important;}
.btn-active3 {background:var(--color-active3) !important;}
.btn-hover {background:var(--color-hover) !important;}
.btn-blue {background:var(--color-blue) !important;}
.btn-indigo {background:var(--color-indigo) !important;}
.btn-purple {background:var(--color-purple) !important;}
.btn-pink {background:var(--color-pink) !important;}
.btn-red {background:var(--color-red) !important;}
.btn-orange {background:var(--color-orange) !important;}
.btn-yellow {background:var(--color-yellow) !important;}
.btn-green {background:var(--color-green) !important;}
.btn-teal {background:var(--color-teal) !important;}
.btn-cyan {background:var(--color-cyan) !important;}
.btn-white {background:var(--color-white) !important; color:var(--color-black) !important;}
.btn-black {background:var(--color-black) !important;}
.btn-warning {background:var(--color-warning) !important;}
.btn-success {background:var(--color-success) !important;}
.btn-danger-100 {background:var(--color-danger-100) !important;}
.btn-danger-200 {background:var(--color-danger-200) !important;}
.btn-gray-100 {background:var(--color-gray-100) !important; color:var(--color-gray-900) !important;}
.btn-gray-200 {background:var(--color-gray-200) !important; color:var(--color-gray-900) !important;}
.btn-gray-300 {background:var(--color-gray-300) !important; color:var(--color-gray-900) !important;}
.btn-gray-400 {background:var(--color-gray-400) !important; color:var(--color-gray-900) !important;}
.btn-gray-500 {background:var(--color-gray-500) !important;}
.btn-gray-600 {background:var(--color-gray-600) !important;}
.btn-gray-700 {background:var(--color-gray-700) !important;}
.btn-gray-800 {background:var(--color-gray-800) !important;}
.btn-gray-900 {background:var(--color-gray-900) !important;}
.btn-black-100 {background:var(--color-black-100) !important;}
.btn-black-200 {background:var(--color-black-200) !important;}
.btn-black-300 {background:var(--color-black-300) !important;}
.btn-black-400 {background:var(--color-black-400) !important;}
.btn-black-500 {background:var(--color-black-500) !important;}
.btn-black-600 {background:var(--color-black-600) !important;}
.btn-black-700 {background:var(--color-black-700) !important;}

.btn-disabled-outline {border:1px solid; border-color:var(--color-gray-600) !important; color:var(--color-gray-600) !important;}
.btn-active-outline {border:1px solid; border-color:var(--color-active) !important; color:var(--color-active) !important;}
.btn-active2-outline {border:1px solid; border-color:var(--color-active2) !important; color:var(--color-active2) !important;}
.btn-active3-outline {border:1px solid; border-color:var(--color-active3) !important; color:var(--color-active3) !important;}
.btn-hover-outline {border:1px solid; border-color:var(--color-hover) !important; color:var(--color-hover) !important;}
.btn-blue-outline {border:1px solid; border-color:var(--color-blue) !important; color:var(--color-blue) !important;}
.btn-indigo-outline {border:1px solid; border-color:var(--color-indigo) !important; color:var(--color-indigo) !important;}
.btn-purple-outline {border:1px solid; border-color:var(--color-purple) !important; color:var(--color-purple) !important;}
.btn-pink-outline {border:1px solid; border-color:var(--color-pink) !important; color:var(--color-pink) !important;}
.btn-red-outline {border:1px solid; border-color:var(--color-red) !important; color:var(--color-red) !important;}
.btn-orange-outline {border:1px solid; border-color:var(--color-orange) !important; color:var(--color-orange) !important;}
.btn-yellow-outline {border:1px solid; border-color:var(--color-yellow) !important; color:var(--color-yellow) !important;}
.btn-green-outline {border:1px solid; border-color:var(--color-green) !important; color:var(--color-green) !important;}
.btn-teal-outline {border:1px solid; border-color:var(--color-teal) !important; color:var(--color-teal) !important;}
.btn-cyan-outline {border:1px solid; border-color:var(--color-cyan) !important; color:var(--color-cyan) !important;}
.btn-white-outline {border:1px solid; border-color:var(--color-white) !important; color:var(--color-white) !important;}
.btn-black-outline {border:1px solid; border-color:var(--color-black) !important; color:var(--color-black) !important;}
.btn-warning-outline {border:1px solid; border-color:var(--color-warning) !important; color:var(--color-warning) !important;}
.btn-success-outline {border:1px solid; border-color:var(--color-success) !important; color:var(--color-success) !important;}
.btn-danger-100-outline {border:1px solid; border-color:var(--color-danger-100) !important; color:var(--color-danger-100) !important; background:var(--color-white);}
.btn-danger-200-outline {border:1px solid; border-color:var(--color-danger-200) !important; color:var(--color-danger-200) !important; background:var(--color-white);}
.btn-gray-100-outline {border:1px solid; border-color:var(--color-gray-100) !important; color:var(--color-gray-600) !important; background:var(--color-white);}
.btn-gray-200-outline {border:1px solid; border-color:var(--color-gray-200) !important; color:var(--color-gray-600) !important; background:var(--color-white);}
.btn-gray-300-outline {border:1px solid; border-color:var(--color-gray-300) !important; color:var(--color-gray-600) !important; background:var(--color-white);}
.btn-gray-400-outline {border:1px solid; border-color:var(--color-gray-400) !important; color:var(--color-gray-600) !important; background:var(--color-white);}
.btn-gray-500-outline {border:1px solid; border-color:var(--color-gray-500) !important; color:var(--color-gray-600) !important; background:var(--color-white);}
.btn-gray-600-outline {border:1px solid; border-color:var(--color-gray-600) !important; color:var(--color-gray-600) !important; background:var(--color-white);}
.btn-gray-700-outline {border:1px solid; border-color:var(--color-gray-700) !important; color:var(--color-gray-700) !important; background:var(--color-white);}
.btn-gray-800-outline {border:1px solid; border-color:var(--color-gray-800) !important; color:var(--color-gray-800) !important; background:var(--color-white);}
.btn-gray-900-outline {border:1px solid; border-color:var(--color-gray-900) !important; color:var(--color-gray-900) !important; background:var(--color-white);}
.btn-black-100-outline {border:1px solid; border-color:var(--color-black-100) !important; color:var(--color-black-100) !important; background:var(--color-white);}
.btn-black-200-outline {border:1px solid; border-color:var(--color-black-200) !important; color:var(--color-black-200) !important; background:var(--color-white);}
.btn-black-300-outline {border:1px solid; border-color:var(--color-black-300) !important; color:var(--color-black-300) !important; background:var(--color-white);}
.btn-black-400-outline {border:1px solid; border-color:var(--color-black-400) !important; color:var(--color-black-400) !important; background:var(--color-white);}
.btn-black-500-outline {border:1px solid; border-color:var(--color-black-500) !important; color:var(--color-black-500) !important; background:var(--color-white);}
.btn-black-600-outline {border:1px solid; border-color:var(--color-black-600) !important; color:var(--color-black-600) !important; background:var(--color-white);}
.btn-black-700-outline {border:1px solid; border-color:var(--color-black-700) !important; color:var(--color-black-700) !important; background:var(--color-white);}
.btn-disabled-outline:hover {background:var(--color-disabled) !important; color:var(--color-gray-900) !important;}
.btn-active-outline:hover {background:var(--color-active) !important; color:var(--color-white) !important;}
.btn-active2-outline:hover {background:var(--color-active2) !important; color:var(--color-white) !important;}
.btn-active3-outline:hover {background:var(--color-active3) !important; color:var(--color-white) !important;}
.btn-hover-outline:hover {background:var(--color-hover) !important; color:var(--color-white) !important;}
.btn-blue-outline:hover {background:var(--color-blue) !important; color:var(--color-white) !important;}
.btn-indigo-outline:hover {background:var(--color-indigo) !important; color:var(--color-white) !important;}
.btn-purple-outline:hover {background:var(--color-purple) !important; color:var(--color-white) !important;}
.btn-pink-outline:hover {background:var(--color-pink) !important; color:var(--color-white) !important;}
.btn-red-outline:hover {background:var(--color-red) !important; color:var(--color-white) !important;}
.btn-orange-outline:hover {background:var(--color-orange) !important; color:var(--color-white) !important;}
.btn-yellow-outline:hover {background:var(--color-yellow) !important; color:var(--color-white) !important;}
.btn-green-outline:hover {background:var(--color-green) !important; color:var(--color-white) !important;}
.btn-teal-outline:hover {background:var(--color-teal) !important; color:var(--color-white) !important;}
.btn-cyan-outline:hover {background:var(--color-cyan) !important; color:var(--color-white) !important;}
.btn-white-outline:hover {background:var(--color-white) !important; color:var(--color-black) !important;}
.btn-black-outline:hover {background:var(--color-black) !important; color:var(--color-white) !important;}
.btn-warning-outline:hover {background:var(--color-warning) !important; color:var(--color-white) !important;}
.btn-success-outline:hover {background:var(--color-success) !important; color:var(--color-white) !important;}
.btn-danger-100-outline:hover {background:var(--color-danger-100) !important; color:var(--color-white) !important;}
.btn-danger-200-outline:hover {background:var(--color-danger-200) !important; color:var(--color-white) !important;}