@charset "utf-8";
@import url('/css/font.css');
@import url('/css/remixicon.css');
@import url('/css/xeicon.css');
@import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display:ital,wght@0,300..900;1,300..900&display=swap');
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard-gov.min.css");

/********************************************************
■ Reset
********************************************************/
*{margin:0; padding:0; box-sizing:border-box;}
*:focus { outline:none; }

html, body {font-family:'Pretendard GOV','Noto Sans KR','sans-serif';  color:#3E4345; font-weight:400; -webkit-text-size-adjust:none;text-size-adjust:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale; line-height:1;  word-break: keep-all; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-backface-visibility: hidden;  letter-spacing:-0.03em;}
html.font-loaded, body.font-loaded{font-family:'Red Hat Display','Pretendard GOV','Noto Sans KR','sans-serif'; } 
html, body, div, span, form, input, select, button, textarea, legend, fieldset, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, blockquote, address, p, th, td, caption {margin:0;padding:0}
ol, ul, li {list-style:none;}
em, dt, dd, address, i {font-style:normal}
img {vertical-align:middle}
img, fieldset {border:0 none;}
button {border:0 none;background:transparent;cursor:pointer;}
hr {display:none;}
legend, .skip, .blind, .skip_nav, .hide {width:0;height:0;visibility:hidden;font-size:0;line-height:0;position:absolute;top:0;left:-9999em;overflow:hidden;}
table caption {display:none}
table {border-collapse:collapse;border-spacing:0;}
header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption {display:block;}
a{color:inherit;}
a:link, a:visited {text-decoration:none; }
a:hover, a:active {text-decoration:none}
h1, h2, h3, h4, h5, h6{font-family: inherit;  font-size: inherit; color: inherit;margin: 0; line-height:1.2;}
input, select {border-radius:0;-webkit-appearance:none; font-family: inherit; font-size: 0.85rem; letter-spacing: 0em; color: inherit;	padding: 0; outline: none;}
textarea {border-radius:0;-webkit-appearance:none; font-family: inherit; font-size: 0.75rem; letter-spacing: 0em; color: inherit;	padding: 0; outline: none;}
button {border:0; cursor: pointer; font-family:'Pretendard GOV','Noto Sans KR','sans-serif'; }

.clearfix { display:block; }
.clearfix:after { display:block; clear:both; content:"."; visibility:hidden; height:0; }

.redhat{font-family:'Red Hat Display','Pretendard GOV','Noto Sans KR','sans-serif';}

/* 입력 스타일 */
input[type="checkbox"]{vertical-align:middle; display: inline-block; width: 1rem;  height: 1rem; border: 1px solid #d9d9d9 ; background-color:#fff;}
input[type="checkbox"]:checked{background-color:var(--sub); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 22 22' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M17.1824 8.23105L8.97611 15.8903L4.29297 11.2071L5.70718 9.79289L9.02404 13.1097L15.8178 6.76894L17.1824 8.23105Z' fill='white'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position: 50% 50%; background-size:100% 100%; border: 1px solid var(--sub);}
input[type="checkbox"]:disabled{background:#E8E8E8; border-color:#d9d9d9}
input[type="checkbox"]:checked:disabled{background-color:#E8E8E8; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 22 22' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M17.1824 8.23105L8.97611 15.8903L4.29297 11.2071L5.70718 9.79289L9.02404 13.1097L15.8178 6.76894L17.1824 8.23105Z' fill='%23838383'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position: 50% 50%; background-size:100% 100%; border-color:#d9d9d9}


input[type="radio"] { display: inline-block; width: 1rem;  height: 1rem; border: 1px solid #d9d9d9 ; border-radius: 50%; background-color:#fff; vertical-align:middle}
input[type="radio"]:checked{background-color:var(--sub); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 22 22' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M17.1824 8.23105L8.97611 15.8903L4.29297 11.2071L5.70718 9.79289L9.02404 13.1097L15.8178 6.76894L17.1824 8.23105Z' fill='white'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position: 50% 50%; background-size:100% 100%; border: 1px solid var(--sub);}
input[type="radio"]:disabled{background:#E8E8E8 ;border-color:#d9d9d9}
input[type="radio"]:checked:disabled{background-color:#E8E8E8; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 22 22' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M17.1824 8.23105L8.97611 15.8903L4.29297 11.2071L5.70718 9.79289L9.02404 13.1097L15.8178 6.76894L17.1824 8.23105Z' fill='%23838383'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position: 50% 50%; background-size:100% 100%; border-color:#d9d9d9}

input[type="password"],
input[type="text"] {-webkit-appearance:none; width:100%; background:#fff;  border:1px solid #b3b3b3; -webkit-appearance: none; box-shadow: none; padding: 0px 0.25rem;  box-sizing:border-box;  height: 1.5rem; text-align:left; font-size:0.75rem; }
input.datepicker{padding-right:1.5rem; background:url('/images/default/content/cal.png')no-repeat right 5px top 50%/0.75rem auto;}
select {height:1.5rem; line-height:1.5rem; font-size:0.75rem; padding:0 1.5rem 0 0.25rem;font-family: inherit; background:#fff url("/images/default/content/sel_icon.svg") no-repeat right 0.5rem center;  background-size:0.6rem auto;-webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #b3b3b3; border-radius: 0px; vertical-align:middle;}
select::-ms-expand { /* for IE 11 */   display: none;}
textarea{padding:0.5rem; width:100%; box-sizing:border-box; vertical-align:middle; line-height:1.5; background:#fff; border:1px solid #b3b3b3;  color:#898989; -webkit-appearance: none; box-shadow: none; border-radius:0; resize: vertical; }

/* 웹접근성용 */
.hidden, .sr_only {	position: absolute;	width: 1px;	height: 1px;	margin: -1px;	padding: 0;	overflow: hidden; clip: rect(0, 0, 0, 0);	white-space: nowrap; border: 0;}

/* button */
.button{display:inline-block; overflow:hidden; position:relative; min-width:5rem; height:2.5rem; line-height:2.5rem; box-sizing:border-box; padding:0 2rem;  color:#fff; text-align:center; vertical-align:top; box-shadow: 3px 4px 18px 2px rgb(204 204 204 / 25%); transition: all 0.3s ease; cursor:pointer; z-index:0; vertical-align:middle; }
.button span{position:relative; z-index:2;}
.button.red{background:var(--red); border:1px solid var(--red);}
.button.green{background:var(--main); border:1px solid var(--main);}
.button.blue{background:var(--sub); border:1px solid var(--sub);}
.button.black{background:var(--black); border:1px solid var(--black);}
.button.gray{background:var(--gray); border:1px solid var(--gray);}
.button.white{background:#fff; border:1px solid #cdcdcd; color:#444}
.button:hover{box-shadow:5px 15px 20px rgba(0,0,0,0.15);}

/*safari input*/
input[type='button'],
input[type='submit'] { -webkit-appearance: none; }

/* IPHONE */
input:disabled, textarea:disabled { opacity: 1; -webkit-text-fill-color: inherit; background:#F7F7F7;}
input[type="text"], input[type="password"] { -webkit-appearance: none; }


:-ms-input-placeholder{color:$color-dusty-gray !important;}/* Internet Explorer 10-11 */
::-ms-input-placeholder{color:$color-dusty-gray !important;}/* Microsoft Edge */
::placeholder{color:$color-dusty-gray;opacity:1;}/* Chrome, Firefox, Opera, Safari 10.1+ */


/* 아이폰(사파리) 터치 메뉴 활성화 관련 */
a, button,
[role=button], [role=link], [role=tab] {-webkit-touch-callout:none;}

@media (max-width:767px){
select{min-width:auto;}
/* Prevent Zoom in when foucing input */
input, select, textarea {font-size:15px !important;}

}


/********************************************************
■ 공통
********************************************************/
/*세팅*/
:root{
	--black: #000;
	--main:#018CAA;
	--sub:#0053B5;
	--lmain:#D7F2F1;

	--blue:#0053B5;
	--mint:#25C5D6;
	--green:#06A561;
	--green2:#36C48E;
	--green3:#009089;
	--green4:#2A6F74;
	--red:#F73F3F;
	--yellow:#FBB017;
	--orange:#F76F35;
	--purple:#6A4BCD;
	--sky:#36CDFA;
	--gray:#6E86AF;
	
	--black:#000;
	--gray-1: #1E2756;
	--gray-2: #222;
	--gray-3: #353535;
	--gray-4: #444;
	--gray-5: #555;
	--gray-6: #6a6a6a;
	--gray-8: #878AA6;
	--gray-d: #ddd;
	--gray-c: #c5c5c5;
	--gray-e: #E6E6E6;
	--gray-a: #AEB6C3;
	--gray-f4: #F4F7F9;

	--blueM:#0072EE;
	--greenM:#009FA9;
	--green2M:#2A6F74;
}

/*basic*/
.clear {clear:both;}
.of{overflow:hidden;}
.blind{display:none;}

/*text-color*/
.text_white {color:#fff !important;}
.text_red {color:var(--red) !important;}
.text_blue {color:var(--blue);}
.text_green {color:var(--green);}
.text_orange {color:var(--orange);}
.text_purple {color:var(--purple);}
.text_sky {color:var(--sky);}

/*width*/
.w0 { width:0% !important; }
.w10 { width:10% !important; }
.w20 { width:20% !important; }
.w22 { width:22% !important; }
.w30 { width:30% !important; }
.w40 { width:40% !important; }
.w45 { width:45% !important; }
.w50 { width:50% !important; }
.w60 { width:60% !important; }
.w70 { width:70% !important; }
.w80 { width:80% !important; }
.w90 { width:90% !important; }
.w100 { width:100% !important; }


/*margin-top*/
.mt100 {margin-top:100px !important;}
.mt90 {margin-top:90px !important;}
.mt80 {margin-top:80px !important;}
.mt70 {margin-top:70px !important;}
.mt60 {margin-top:60px !important;}
.mt50 {margin-top:50px !important;}
.mt40 {margin-top:3rem !important;}
.mt30 {margin-top:30px !important;}
.mt20 {margin-top:20px !important;}
.mt10 {margin-top:10px !important;}
.mt5 {margin-top:5px !important;}
.mt0 {margin-top:0 !important;}

/*float*/
.fl {float:left !important;}
.fr {float:right !important;}
.fn {float:none !important;}

/*text-align*/
.ac {text-align:center !important;}
.al {text-align:left !important;}
.ar {text-align:right !important;}
.aj {text-align:justify !important;}

/*text-decoration*/
.tdo {text-decoration:overline;}
.tdl {text-decoration:line-through;}
.tdo {text-decoration:underline;}




/********************************************************
■ 테이블
********************************************************/
.table{width:100%;margin:20px 0 15px;background-color:#fff;font-size:16px;line-height:22px;}
.table.fixed{table-layout:fixed;}
.table .caption{display:none;}
.table.break tbody td,.table.break thead th,.table.break tbody td,.table.break tbody th{word-break:break-all;}

.table th, .table td{border:1px solid #e0e1e3;}
.table thead th{padding:14px 10px;border-color:#ceded9;border-bottom-color:#ceded9;background-color:#f6faf9;color:#144d3c;font-weight:400;}
.table thead th + th{}
.table thead th:first-child{border-left:none;}
.table thead th:last-child{border-right:none;}
.table tfoot th:last-child{border-right:none;}
.table tbody th, .table tfoot th{background-color:#fcfcfd;font-weight:400;color:#202435;}
.table tbody th, .table tbody td, .table tfoot th, .table tfoot td{padding:14px 25px;}

.table tfoot td:first-child{border-left:none;}
.table tbody tr th:last-child{border-right:none;}
.table td:last-child{border-right:none;}
.table td:first-child{border-left:none;}
.table th:last-child{border-right:none;}
.table th:first-child{border-left:none;}
.table tbody th + td, .table tbody td + td, .table tfoot td{border-left-color:#d5d8dd;}
/*.table tbody tr:first-child th, .table tbody tr:first-child td{border-top:1px solid #c5c9d6;}*/
.table tbody td, .table tfoot td{text-align:center;font-size:15px;font-weight:200;color:#444;}
.table tbody td ul{margin-top:0;margin-bottom:0;padding-left:10px;}
.table tbody td ul.bu_clear{padding-left:0;}
.table tbody td ol{margin-top:0;margin-bottom:0;}
.table{position:relative;}
.table thead tr:last-child th, .table thead th[rowspan]{border-bottom:none;}
.table tbody tr:last-child th, .table tbody tr:last-child td{border-bottom:none;}
.table tbody th[rowspan], .table tbody td[rowspan]{border-bottom:none;}
.table tfoot th[rowspan], .table tfoot td[rowspan]{border-bottom:none;}

.table thead th{border-color:#ceded9;}
.table tbody tr:first-child th, .table tbody tr:first-child td{border-top-color:#ceded9;}
.table:before{display:block;position:absolute;top:1px;left:0;width:100%;height:1px;background-color:#026447;}
.table:after{display:block;position:absolute;bottom:0;left:0;width:100%;height:1px;background-color:#bec1c6;}

/* thead에 tr이 두 개 이상일 때 */
.table.tr_over colgroup + thead tr:first-child th{font-size:16px;}
.table.tr_over colgroup + thead tr th{font-size:15px;}
.table.tr_over thead th{background-color:#f6faf9;color:#212121;}
.table.tr_over tbody tr:first-child th,
.table.tr_over tbody tr:first-child td{}
.table.tr_over caption + thead tr:first-child th, .table.tr_over caption + thead tr:first-child td, .table.tr_over colgroup + thead tr:first-child th, .table.tr_over colgroup + thead tr:first-child td, .table.tr_over caption + tbody tr:first-child th, .table.tr_over caption + tbody tr:first-child td, .table.tr_over colgroup + tbody tr:first-child th{background-color:#f6faf9;font-weight:400;color:#144d3c;}


/********************************************************
■ 아이콘
********************************************************/
[class^="icon_"]{display:inline-block; width:1rem; height:1rem; background-repeat:no-repeat; background-position:50% 50%; background-size:100% 100%;}
.icon_search{background-image:url('/images/default/main/icon_search.svg');}
.icon_search_w{background-image:url('/images/default/main/icon_search_w.svg');}
.icon_logout{background-image:url('/images/default/main/icon_logout.svg');}
.icon_reset{background-image:url('/images/default/main/icon_reset.svg');}
.icon_circle_plus{background-image:url('/images/default/main/icon_circle_plus.svg');}
.icon_circle_minus{background-image:url('/images/default/main/icon_circle_minus.svg');}
.icon_circle_search{background-image:url('/images/default/main/icon_circle_search.svg');}
.icon_down{background-image:url('/images/default/main/icon_down.svg');}
.icon_upload{background-image:url('/images/default/main/icon_upload.svg');}
.icon_change{background-image:url('/images/default/main/icon_change.svg');}
.icon_book_w{background-image:url('/images/default/main/icon_book_w.svg');}
.icon_box{background-image:url('/images/default/main/icon_box.svg');}
.icon_remove{background-image:url('/images/default/main/icon_remove.svg');}
.icon_page{background-image:url('/images/default/main/icon_page.svg');}
.icon_page2{background-image:url('/images/default/main/icon_page2.svg');}
.icon_page3{background-image:url('/images/default/main/icon_page3.svg');}
.icon_report{background-image:url('/images/default/main/icon_report.svg');}
.icon_upload2{background-image:url('/images/default/main/icon_upload2.svg');}
.icon_warning{background-image:url('/images/default/main/icon_warning.svg');}
.icon_check{background-image:url('/images/default/main/icon_check.svg');}
.icon_ing{background-image:url('/images/default/main/icon_ing.svg');}
.icon_check_g{background-image:url('/images/default/main/icon_check_g.svg');}
.icon_read_w{background-image:url('/images/default/main/icon_read_w.svg');}
.icon_chat_w{background-image:url('/images/default/main/icon_chat_w.svg');}

/*회색아이콘*/
.icon_plus{background-image:url('/images/default/main/icon_plus.svg');}
.icon_circle_plus2{background-image:url('/images/default/main/icon_circle_plus2.svg');}
.icon_circle_minus2{background-image:url('/images/default/main/icon_circle_minus2.svg');}
.icon_print{background-image:url('/images/default/main/icon_print.svg');}
.icon_pdf{background-image:url('/images/default/main/icon_pdf.svg');}
.icon_pdf2{background-image:url('/images/default/main/icon_pdf2.svg');}
.icon_folder{background-image:url('/images/default/main/icon_folder.svg');}
.icon_list{background-image:url('/images/default/main/icon_list.svg');}
.icon_note{background-image:url('/images/default/main/icon_note.svg');}
.icon_coin{background-image:url('/images/default/main/icon_coin.svg');}
.icon_del{background-image:url('/images/default/main/icon_del.svg');}
.icon_down2{background-image:url('/images/default/main/icon_down2.svg');}
.icon_report2{background-image:url('/images/default/main/icon_report2.svg');}
.icon_sms{background-image:url('/images/default/main/icon_sms.svg');}
.icon_upload3{background-image:url('/images/default/main/icon_upload3.svg');}
.icon_warning2{background-image:url('/images/default/main/icon_warning2.svg');}
.icon_change_g{background-image:url('/images/default/main/icon_change_g.svg');}


/********************************************************
■ button
********************************************************/
/* 버튼 오른쪽아이콘 */
.btnIcon{position:relative; border:1px solid #ddd; background:#fff; width:auto; height:1.5rem; border-radius:0 4px 4px 0; font-size:0.7rem; font-weight:500; color:#333; padding:0 2rem 0 0.5rem; cursor:pointer}
.btnIcon [class^="icon_"]{position:absolute; right:0px; top:0px; height:calc(1.5rem - 2px); width:1.5rem; border-radius:0 3px 3px 0; background-size:0.9rem 0.9rem; background-color:#1B365C;}
.btnIcon:nth-of-type(2) [class^="icon_"],
.btnIcon:nth-of-type(5) [class^="icon_"]{background-color:var(--sub);}
.btnIcon:nth-of-type(3n) [class^="icon_"]{background-color:var(--main);}

/* 사각 라인버튼 */
.btnLine{position:relative; display:inline-flex; align-items: center; gap:0.3rem; border:1px solid #ddd; background:#fff; width:auto; height:1.5rem;  font-size:0.7rem; font-weight:500; color:#333; padding:0 0.5rem; border-radius:0.1rem; vertical-align: middle; cursor:pointer}
.btnLine [class^="icon_"]{height:1rem; width:1rem; background-size:0.9rem 0.9rem; }

.btnLine.favorite i{ vertical-align: baseline !important;}
.btnLine.favorite.delete i{color:var(--blue);}

/* 둥근 버튼 */
.btnRound{display:inline-flex; align-items: center; background:#fff; width:auto; height:1.5rem;  font-size:0.75rem; font-weight:500; color:#555; padding:0 0.6rem; border-radius:1.5rem; border:none; cursor:pointer}
.btnRound [class^="icon_"]{height:1rem; width:1rem; background-size:1rem 1rem; margin-left:0.2rem; }
.btnRound.on{color: var(--blue);}

/*관리에 쓰이는 버튼*/
.sbtn{display:inline-block; height:1.3rem; line-height:1.3rem; margin: 1px 0; padding:0 0.5rem; border-radius:0.25rem; color:#fff; font-size:0.7rem; text-align:center; cursor:pointer; border:none; vertical-align: middle; font-weight: 400;}
.sbtn.green{background:var(--main);}
.sbtn.green2{background:var(--green2);}
.sbtn.blue{background:var(--sub);}
.sbtn.sky{background:var(--sky);}
.sbtn.red{background:var(--red);}
.sbtn.yellow{background:var(--yellow);}
.sbtn.orange{background:var(--orange);}
.sbtn.purple{background:var(--purple);}
.sbtn.gray{background:var(--gray);}

.rbtn{border-radius:0.25rem; border:none; cursor:pointer;}

/* 버튼 사이즈 */
.sm{height: 1.6rem; line-height:1.6rem; padding:0 0.8rem; font-size:0.8rem; }
.md{height: 2.2rem; line-height:2.2rem; padding:0 1rem; font-size:1rem; }
.lg{height: 2.8rem; line-height:2.8rem; padding:0 1.2rem; font-size:1.1rem; }
.xlg{height: 3.2rem; line-height:3.2rem; padding:0 1.4rem; font-size:1.3rem;}

.big{display:block; width: 100%; height: 2rem; font-size:0.9rem;}
.big + .big{margin-top:0.2rem;}

/* 추가 버튼 */
.btnStyle{ display: inline-block; position:relative; font-weight: 400; line-height: 1.5; border-radius: 0.25rem; color: #212529; text-align: center; text-decoration: none; vertical-align: middle; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-color: transparent; border: 1px solid transparent; padding: 0.25rem 0.5rem 0.15rem; padding-left:2rem; font-size:0.65rem; -webkit-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out; }
.btnStyle i{position: absolute; border-radius: 0.25rem; width: 1.5rem; left: -1px; top: -1px; bottom: -1px; background-color: rgba(255,255,255,.1); font-size: 0.7rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.btnStyle:hover{color:#fff !important;}

/* 추가 버튼색상 */
.btn-gray-500 { color: #fff; background-color: #adb5bd; border-color: #adb5bd;}
.btn-gray { color: #fff; background-color: #878a99; border-color: #878a99;}
.btn-gray-dark{ color: #fff; background-color: #343a40; border-color: #343a40;}
.btn-blue { color: #fff; background-color: var(--sub); border-color: var(--sub);}
.btn-blue2 { color: #fff; background-color: #3689FF; border-color: #3689FF;}
.btn-indigo { color: #fff; background-color: #405189; border-color: #405189;}
.btn-purple { color: #fff; background-color: var(--purple); border-color: var(--purple);}
.btn-pink { color: #fff; background-color: #f672a7; border-color: #f672a7;}
.btn-red { color: #fff; background-color: var(--red); border-color: var(--red);}
.btn-orange { color: #fff; background-color: var(--orange); border-color: var(--orange);}
.btn-yellow { color: #fff; background-color: var(--yellow); border-color: var(--yellow);}
.btn-green { color: #fff; background-color: var(--green); border-color: var(--green);}
.btn-main { color: #fff; background-color: var(--main); border-color: var(--main);}
.btn-mint { color: #fff; background-color: var(--mint); border-color: var(--mint);}
.btn-sky { color: #fff; background-color: var(--sky); border-color: var(--sky);}
.btn-green2{color: #fff; background-color: var(--green2); border-color:  var(--green2);}
.btn-green3{color: #fff; background-color: var(--green3); border-color:  var(--green3);}
.btn-green4{color: #fff; background-color: var(--green4); border-color:  var(--green4);}
.btn-lmain{color: #2A6F74; background-color: var(--lmain); border-color:  var(--lmain);}
.btn-lblue{color: var(--blue); background-color: #D9E4FF; border-color:  #D9E4FF;}
.btn-lgreen{color: #2A6F74; background-color: #D7F2F1; border-color:  #D7F2F1;}
.btn-lred{color: var(--red); background-color: #FCD5D9; border-color:  #FCD5D9;}
.btn-lyellow{color: var(--orange); background-color: #FFF4C9; border-color:  #FFF4C9;}
.btn-lgray{color: var(--gray-8); background-color: #E6E9F4; border-color:  #E6E9F4;}
.btn-lgray2{color: #7E84A3; background-color: #E0ECF6; border-color:  #E0ECF6;}