@charset 'utf-8';


/*
 * !!!!유틸!!!!
 */


/*
 * grid
 * tab 사용시 같이 사용
 * 좌우 버튼 위치시 col + 정렬클래스와 함께
 */
.col > * { /* display:flex; flex-direction:row; */ float:left; }
.col.col-2 > *  { width:50%; }
.col.col-3 > *  { width:33.333333333333333%; }
.col.col-4 > *  { width:25%; }
.col.col-5 > *  { width:20%; }
.col.col-6 > *  { width:16.666666666666666%; }
.col.col-7 > *  { width:14.285714285714286%; }
.col.col-8 > *  { width:12.5%; }
.col.col-9 > *  { width:11.11111111111111%; }
.col.col-10 > * { width:10%; }
.col::after { content:''; display:block; clear:left; }


/*
 * !!recommand!! - 간격
 * 아이콘 공통화 코드 + 개별 이미지 + 이미지 맵 방식 교체
 */
.icon { display:inline-block; text-align:left; text-indent:-9999em; overflow:hidden; }

	/*
	 * !!deprecated!! - 아이콘
	 * 관리안됨.
	 */
	.icn {background:url('/img/com/icn_set.png') no-repeat; vertical-align:middle; display:inline-block; *display:inline; *zoom:1; text-indent:-999999px;}
	.icnWish {background-position:0 0; width:14px; height:14px;}
	.icnWishB {background-position:-20px -362px; width:24px; height:19px;}
	.icnDown {background-position:0 -61px; width:11px; height:8px;}
	.icnMenu {background-position:-25px -41px; width:16px; height:14px;}
	.icnMy {background-position:0 -41px; width:16px; height:16px;}
	.icnQmark {background-position:0 -297px; background-color:#fff; width:14px; height:14px; border:1px solid #ccc;}
	.icnQmark:hover ,
	.icnQmark:focus {border:1px solid #333;}
	.icnEvent {background-position:0 -20px; width:50px; height:19px;}


/* 사이즈 */
.wid100 {width:100% !important;}

/* bg */
.bgf7 {background:#f7f7f7 !important;}
.bgfb {background:#fbfbfb !important;}


/* border */
.bod0 {border:0 !important;}
.bodT0 {border-top:0 !important;}
.bodR0 {border-right:0 !important;}
.bodB0 {border-bottom:0 !important;}
.bodL0 {border-left:0 !important;}

/* position */
.posR {position:relative !important;}
.posA {position:absolute !important;}

.alC, .tac {text-align:center !important;}
.alL {text-align:left !important;}
.alR {text-align:right !important;}
.alJ {text-align:justify !important;}
.vaT {vertical-align:top !important;}
.vaM {vertical-align:middle !important;}
.vaB {vertical-align:bottom !important;}
.leftarea {float: left;}
.left_area {float:left;}
.rightarea {float: right;}
.right_area {float: right;}

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

	/*
	 * !!deprecated!!
	 * 어디서 사용하는지 알 수 없고, common에 들어오기 너무 지엽적임.
	 */
	.vapx {vertical-align:-1px !important;}
	img.noimg {width: 100%; height: 100%;}

	.trade_gline_box {overflow:hidden; border:1px solid #ddd; padding:5px 30px 30px; font-size:13px; }
	.p_dot_list p {padding-left:13px; text-indent:-1px; line-height:1.4; background:url(/resources/images/icon/dot_gray.gif) 0 9px no-repeat; color:#999;}
	p.hypen_list {padding-left:10px; text-indent:-9px; font-size:13px;}


/*
 * !!recommand!!
 */
.fHide { position:absolute; left:-9999em; }

	/*
	 * !!deprecated!!
	 * 접근성 맞지 않음.
	 */
	.hide{display:none !important;}
	.visibillity {display:block !important;}
	.hidden{visibility:hidden;}
	.hide2,
	input[type=hidden]{position:absolute; top:0; left:0; overflow:hidden; width:1px; height:1px; font-size:0; line-height:0; text-indent:-9999em}

/*
 * !!recommand!! - font
 */
.fTxt_eng { font-family:'Verdana','Malgun Gothic','맑은 고딕' !important; letter-spacing:0px; }

.fTxt_orange { color:#ca6015 !important; }
.fTxt_blue { color:#249dff !important; }
.fTxt_red { color:#ff232e !important; }
.fTxt_green { color:#039314 !important; }
.fTxt_lightgray { color:#999 !important; }
.fTxt_gray { color:#666 !important; }
.fTxt_darkgray { color:#222 !important; }
.fTxt_black { color:#000 !important; }
.fTxt_white { color:#fff !important; }
.fTxt_underline { text-decoration:underline !important; }

.fTxt_bold { /*font-weight:bold;*/ font-weight:700 !important; }

.fTxt_size11 {font-size:11px !important; }
.fTxt_size12 {font-size:12px !important; }
.fTxt_size13 {font-size:13px !important; }
.fTxt_size14 {font-size:14px !important; }
.fTxt_size15 {font-size:15px !important; }
.fTxt_size16 {font-size:16px !important; }
.fTxt_size18 {font-size:18px !important; }
.fTxt_size20 {font-size:20px !important; }
.fTxt_size24 {font-size:24px !important; }
.fTxt_size25 {font-size:25px !important; }

.fTxt_ellipsis { text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }

	/*
	 * !!deprecated!! - font
	 */
	.eng {font-family:'Verdana','Malgun Gothic','맑은 고딕' !important; letter-spacing:0px;}
	.txtOg {color:#ff6c00 !important;}
	.txtBl {color:#7eb5f3 !important;}
	.pointBl {color:#249dff !important;}
	.pointOr {color:#FF6D00 !important;} /* 2026.로그인페이지 UI 개선 m [TES-3537 : P256276] */
	.pointRe {color:#ff232e !important;}
	.pointGn {color:#039314 !important;}
	.pointGy01 {color:#333 !important;}
	.pointGy02 {color:#666 !important;}
	.pointGy03 {color:#838383 !important;}
	.pointBk {color:#000 !important;}
	.pointWh {color:#fff !important;}
	.pointUl {text-decoration:underline !important;}
	.pointRe,
	.pointCl {color:#ff242c !important;}
	.emphasis {color:#FF6D00; font-size:15px; font-weight:700; text-decoration:underline;} /* 2026.로그인페이지 UI 개선 m [TES-3537 : P256276]*/
	.pointCl_b {color:#ff242c;}
	.color_9 {color:#999;}
	.color_3 {color:#333;}
	.txt_col1 {color: #ff6f0e !important;}
	.vab {vertical-align:bottom;}
	.vat {vertical-align:top;}
	.vam {vertical-align:middle;}
	.fs11 {font-size:11px !important;}
	.f12 {font-size:12px;}
	.f13 {font-size:13px;}
	.f15 {font-size:15px;}
	.f16 {font-size:16px !important;}
	.fs16 {font-size:16px !important;}
	.f25 {font-size:25px;}
	.f11 {font-size:11px;}
	.f14 {font-size:14px;}
	.f20 {font-size:20px;}
	.f24 {font-size:24px;}
	.letter_interval1_6 {letter-spacing:-1.6px;}
	.letter_interval1_7 {letter-spacing:-1.7px;}
	.letter_interval2 {letter-spacing:-2px;}

	/* 폰트굵기 > strong 사용... */
	.font05 {font-weight:500 !important;}
	.font07 {font-weight:700 !important;}
	.fwL{font-weight:lighter;}
	.txt_bd {font-weight: bold !important;}

	/* ellipsis */
	.ellipsis {text-overflow: ellipsis; white-space: nowrap; overflow:hidden; height:1em; float:left; }


/*
 * !!recommand!! - 간격
 */
.margin0 { margin:0px !important; }
.margin2 { margin:2px !important; }
.margin5 { margin:5px !important; }
.margin10 { margin:10px !important; }
.margin15 { margin:15px !important; }
.margin20 { margin:20px !important; }
.margin25 { margin:25px !important; }
.margin30 { margin:30px !important; }
.margin40 { margin:40px !important; }
.margin50 { margin:50px !important; }

.marginTop0 { margin-top:0px !important; }
.marginTop2 { margin-top:2px !important; }
.marginTop5 { margin-top:5px !important; }
.marginTop10 { margin-top:10px !important; }
.marginTop15 { margin-top:15px !important; }
.marginTop20 { margin-top:20px !important; }
.marginTop25 { margin-top:25px !important; }
.marginTop30 { margin-top:30px !important; }
.marginTop40 { margin-top:40px !important; }
.marginTop50 { margin-top:50px !important; }

.marginBottom0 { margin-bottom:0px !important; }
.marginBottom2 { margin-bottom:2px !important; }
.marginBottom5 { margin-bottom:5px !important; }
.marginBottom10 { margin-bottom:10px !important; }
.marginBottom15 { margin-bottom:15px !important; }
.marginBottom20 { margin-bottom:20px !important; }
.marginBottom25 { margin-bottom:25px !important; }
.marginBottom30 { margin-bottom:30px !important; }
.marginBottom40 { margin-bottom:40px !important; }
.marginBottom50 { margin-bottom:50px !important; }

.marginLeft0 { margin-left:0px !important; }
.marginLeft2 { margin-left:2px !important; }
.marginLeft5 { margin-left:5px !important; }
.marginLeft10 { margin-left:10px !important; }
.marginLeft15 { margin-left:15px !important; }
.marginLeft20 { margin-left:20px !important; }
.marginLeft25 { margin-left:25px !important; }
.marginLeft30 { margin-left:30px !important; }
.marginLeft40 { margin-left:40px !important; }
.marginLeft50 { margin-left:50px !important; }

.marginRight0 { margin-right:0px !important; }
.marginRight2 { margin-right:2px !important; }
.marginRight5 { margin-right:5px !important; }
.marginRight10 { margin-right:10px !important; }
.marginRight15 { margin-right:15px !important; }
.marginRight20 { margin-right:20px !important; }
.marginRight25 { margin-right:25px !important; }
.marginRight30 { margin-right:30px !important; }
.marginRight40 { margin-right:40px !important; }
.marginRight50 { margin-right:50px !important; }

.padding0 { padding:0px !important; }
.padding2 { padding:2px !important; }
.padding5 { padding:5px !important; }
.padding10 { padding:10px !important; }
.padding15 { padding:15px !important; }
.padding20 { padding:20px !important; }
.padding25 { padding:25px !important; }
.padding30 { padding:30px !important; }
.padding40 { padding:40px !important; }
.padding50 { padding:50px !important; }

.paddingTop0 { padding-top:0px !important; }
.paddingTop2 { padding-top:2px !important; }
.paddingTop5 { padding-top:5px !important; }
.paddingTop10 { padding-top:10px !important; }
.paddingTop15 { padding-top:15px !important; }
.paddingTop20 { padding-top:20px !important; }
.paddingTop25 { padding-top:25px !important; }
.paddingTop30 { padding-top:30px !important; }
.paddingTop40 { padding-top:40px !important; }
.paddingTop50 { padding-top:50px !important; }

.paddingBottom0 { padding-bottom:0px !important; }
.paddingBottom2 { padding-bottom:2px !important; }
.paddingBottom5 { padding-bottom:5px !important; }
.paddingBottom10 { padding-bottom:10px !important; }
.paddingBottom15 { padding-bottom:15px !important; }
.paddingBottom20 { padding-bottom:20px !important; }
.paddingBottom25 { padding-bottom:25px !important; }
.paddingBottom30 { padding-bottom:30px !important; }
.paddingBottom40 { padding-bottom:40px !important; }
.paddingBottom50 { padding-bottom:50px !important; }

.paddingLeft0 { padding-left:0px !important; }
.paddingLeft2 { padding-left:2px !important; }
.paddingLeft5 { padding-left:5px !important; }
.paddingLeft10 { padding-left:10px !important; }
.paddingLeft15 { padding-left:15px !important; }
.paddingLeft20 { padding-left:20px !important; }
.paddingLeft25 { padding-left:25px !important; }
.paddingLeft30 { padding-left:30px !important; }
.paddingLeft40 { padding-left:40px !important; }
.paddingLeft50 { padding-left:50px !important; }

.paddingRight0 { padding-right:0px !important; }
.paddingRight2 { padding-right:2px !important; }
.paddingRight5 { padding-right:5px !important; }
.paddingRight10 { padding-right:10px !important; }
.paddingRight15 { padding-right:15px !important; }
.paddingRight20 { padding-right:20px !important; }
.paddingRight25 { padding-right:25px !important; }
.paddingRight30 { padding-right:30px !important; }
.paddingRight40 { padding-right:40px !important; }
.paddingRight50 { padding-right:50px !important; }

	/*
	 * !!deprecated!! - 간격조절
	 * 지멋대로...
	 */
	.mar00 {margin:0 !important;}
	.marT00 {margin-top:0 !important;}
	.marT01 {margin-top:10px !important;}
	.marT02 {margin-top:20px !important;}
	.marT025 {margin-top:25px !important;}
	.marT03 {margin-top:30px !important;}
	.marT04 {margin-top:40px !important;}
	.marT05 {margin-top:50px !important;}
	.marT06 {margin-top:60px !important;}
	.marT08 {margin-top:80px !important;}
	.marR00 {margin-right:0 !important;}
	.marL00 {margin-left:0 !important;}
	.marL5 {margin-left:5px !important;}
	.marL8 {margin-left:8px !important;}
	.marL01 {margin-left:10px !important;}
	.marT5 {margin-top:5px !important}
	.mt00 {margin-top: 0 !important}
	.mt40 {margin-top: 40px !important}
	.mb18 {margin-bottom: 18px !important}
	.marB01 {margin-bottom:10px !important;}

	.pad00 {padding:0 !important;}
	.pad06 {padding:60px !important;}
	.padR00 {padding-right:0 !important;}
	.padL00 {padding-left:0 !important;}
	.padL01 {padding-left:10px !important;}
	.pt20 {padding-top: 20px !important;}
	.padT00 {padding-top:0 !important;}
	.padT01 {padding-top:10px !important;}
	.padT02 {padding-top:20px !important;}
	.padT03 {padding-top:30px !important;}
	.padT04 {padding-top:40px !important;}
	.padT08 {padding-top:80px !important;}
	.padB01 {padding-bottom:10px !important;}
	.padB02 {padding-bottom:20px !important;}
	.padB08 {padding-bottom:80px !important;}

	.topT00 {top:0 !important;}
	.topT03 {top:30 !important;}


/* =============================================================
   CHECKBOX / RADIO COMMON , 2026.로그인페이지 UI 개선 [TES-3537 : P256276]
============================================================= */
.c-check,
.c-radio {
  --control-size: 20px;
  --icon-size: 12px;
  --label-gap: 8px;
  --form-default-bg: #E7E7E7;
  --form-select-bg: #F88800;

  display: inline-flex;
  align-items: center;
  position: relative;
  cursor: pointer;
  vertical-align: middle;
  line-height: 1;
}

.c-check>input[type="checkbox"],
.c-radio>input[type="radio"] {
  position: absolute;
  opacity: 0;
  inset: 0;
  margin: 0;
  cursor: pointer;
}

.c-check__label,
.c-radio__label {
  margin-left: var(--label-gap);
  font-family: 'Pretendard';
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
  color: #212121;
  word-break: keep-all;
}

/* =========================================
   BOX COMMON
========================================= */
.c-check__box,
.c-radio__box {
  position: relative;
  flex: 0 0 var(--control-size);
  width: var(--control-size);
  height: var(--control-size);
  /* margin-right: var(--label-gap); */
  box-sizing: border-box;
  background-color: var(--form-default-bg);
  border: 1px solid var(--form-default-bg);
  transition: all 0.2s ease;
}

/* hover */
.c-check:hover .c-check__box,
.c-radio:hover .c-radio__box {
  border-color: var(--form-default-bg);
}

/* focus */
.c-check>input[type="checkbox"]:focus-visible + .c-check__box,
.c-radio>input[type="radio"]:focus-visible + .c-radio__box {
  outline: 2px solid var(--form-select-bg);
  outline-offset: 2px;
}

/* disabled */
.c-check>input[type="checkbox"]:disabled + .c-check__box,
.c-radio>input[type="radio"]:disabled + .c-radio__box {
  background-color: #f3f3f3;
  border-color: #ddd;
}

.c-check>input[type="checkbox"]:disabled ~ .c-check__label,
.c-radio>input[type="radio"]:disabled ~ .c-radio__label {
  color: #999;
}

.c-check>input[type="checkbox"]:disabled,
.c-radio>input[type="radio"]:disabled {
  cursor: not-allowed;
}

/* =========================================
   CHECKBOX
========================================= */
.c-check__box {
  border-radius: 50%;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAOdEVYdFNvZnR3YXJlAEZpZ21hnrGWYwAAALlJREFUeAHt0m0JwzAQxvFHQiVUQiXMSSthEiahEuZgFuZgEiKhErI7uEEJuTL2kh70+UGgHwL3pzmAiIiIDiPnPMpZ5CT9RiQWt7YgCokZ7M+tJUTgxKkJe5OI3vatdMEvfbLczeJsWDloRJQ4G1jboRMixNnQqTJQo4fiXufEzfg3GXLeirS4R+XOFa3oMzmRvRN3Q2sbkSUN7rAHJzJG3BuRSZ8cEVQi48S9SNBscfdwcURERPS1JyR7KJjQFPnmAAAAAElFTkSuQmCC");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.c-check>input[type="checkbox"]:checked + .c-check__box {
  background-color: var(--form-select-bg);
  border-color: var(--form-select-bg);

}

.c-check>input[type="checkbox"]:checked + .c-check__box::after {
  /* content: ""; */
  position: absolute;
  inset: 0;
  margin: auto;
  width: var(--icon-size);
  height: var(--icon-size);
  /* background: url("/resources/images/common/icon-check.svg") no-repeat center / contain; */
}

/* =========================================
   RADIO
========================================= */
.c-radio__box {
  border-radius: 50%;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3QgeD0iMSIgeT0iMSIgd2lkdGg9IjE4IiBoZWlnaHQ9IjE4IiByeD0iOSIgZmlsbD0id2hpdGUiLz4KPHJlY3QgeD0iMSIgeT0iMSIgd2lkdGg9IjE4IiBoZWlnaHQ9IjE4IiByeD0iOSIgc3Ryb2tlPSIjRTdFN0U3IiBzdHJva2Utd2lkdGg9IjIiLz4KPHJlY3QgeD0iMSIgeT0iMSIgd2lkdGg9IjE4IiBoZWlnaHQ9IjE4IiByeD0iOSIgc3Ryb2tlPSIjRTdFN0U3IiBzdHJva2Utd2lkdGg9IjIiLz4KPGNpcmNsZSBjeD0iMTAiIGN5PSIxMCIgcj0iNSIgZmlsbD0iI0Q5RDlEOSIvPgo8L3N2Zz4K");
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
}

.c-radio>input[type="radio"]:checked + .c-radio__box {
  border-color: var(--form-select-bg);
  background-color: var(--form-select-bg);
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3QgeD0iMi41IiB5PSIyLjUiIHdpZHRoPSIxNSIgaGVpZ2h0PSIxNSIgcng9IjcuNSIgZmlsbD0id2hpdGUiLz4KPHJlY3QgeD0iMi41IiB5PSIyLjUiIHdpZHRoPSIxNSIgaGVpZ2h0PSIxNSIgcng9IjcuNSIgc3Ryb2tlPSIjRjg4ODAwIiBzdHJva2Utd2lkdGg9IjUiLz4KPC9zdmc+Cg==");
}

/* =========================================
   SIZE
========================================= */

/* small */
.c-check--sm,
.c-radio--sm {
  --control-size: 16px;
  --icon-size: 10px;
  --label-gap: 4px;
}

.c-check--sm .c-check__label,
.c-radio--sm .c-radio__label {
  margin-left: var(--label-gap);
  font-size: 13px;
  font-weight: 400;
}

/* medium */
.c-check--md,
.c-radio--md {
  --control-size: 20px;
  --icon-size: 12px;
  --label-gap: 8px;
}

.c-check--md .c-check__label,
.c-radio--md .c-radio__label {
  font-size: 14px;
}

/* large */
.c-check--lg,
.c-radio--lg {
  --control-size: 24px;
  --icon-size: 14px;
  --label-gap: 10px;
}

.c-check--lg .c-check__label,
.c-radio--lg .c-radio__label {
  font-size: 16px;
}

/* =============================================================
   BOX 마크업 생략 지원 (c-check__box / c-radio__box span 생략 시)
   <label class="c-check"><input>...<span class="c-check__label">텍스트</span></label>
   input 바로 다음 형제가 c-check__label일 때만 매치되므로
   box span이 있는 기존 마크업과는 서로 간섭하지 않음.
============================================================= */
.c-check>input[type="checkbox"] + .c-check__label,
.c-radio>input[type="radio"] + .c-radio__label {
  display: inline-flex;
  align-items: center;
  margin-left: 0;
}

.c-check>input[type="checkbox"] + .c-check__label::before,
.c-radio>input[type="radio"] + .c-radio__label::before {
  content: '';
  flex: 0 0 var(--control-size);
  width: var(--control-size);
  height: var(--control-size);
  margin-right: var(--label-gap);
  box-sizing: border-box;
  background-color: var(--form-default-bg);
  border: 1px solid var(--form-default-bg);
  border-radius: 50%;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  transition: all 0.2s ease;
}

.c-check>input[type="checkbox"] + .c-check__label::before {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAOdEVYdFNvZnR3YXJlAEZpZ21hnrGWYwAAALlJREFUeAHt0m0JwzAQxvFHQiVUQiXMSSthEiahEuZgFuZgEiKhErI7uEEJuTL2kh70+UGgHwL3pzmAiIiIDiPnPMpZ5CT9RiQWt7YgCokZ7M+tJUTgxKkJe5OI3vatdMEvfbLczeJsWDloRJQ4G1jboRMixNnQqTJQo4fiXufEzfg3GXLeirS4R+XOFa3oMzmRvRN3Q2sbkSUN7rAHJzJG3BuRSZ8cEVQi48S9SNBscfdwcURERPS1JyR7KJjQFPnmAAAAAElFTkSuQmCC");
}

.c-radio>input[type="radio"] + .c-radio__label::before {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3QgeD0iMSIgeT0iMSIgd2lkdGg9IjE4IiBoZWlnaHQ9IjE4IiByeD0iOSIgZmlsbD0id2hpdGUiLz4KPHJlY3QgeD0iMSIgeT0iMSIgd2lkdGg9IjE4IiBoZWlnaHQ9IjE4IiByeD0iOSIgc3Ryb2tlPSIjRTdFN0U3IiBzdHJva2Utd2lkdGg9IjIiLz4KPHJlY3QgeD0iMSIgeT0iMSIgd2lkdGg9IjE4IiBoZWlnaHQ9IjE4IiByeD0iOSIgc3Ryb2tlPSIjRTdFN0U3IiBzdHJva2Utd2lkdGg9IjIiLz4KPGNpcmNsZSBjeD0iMTAiIGN5PSIxMCIgcj0iNSIgZmlsbD0iI0Q5RDlEOSIvPgo8L3N2Zz4K");
}

/* hover */
.c-check:hover>input[type="checkbox"] + .c-check__label::before,
.c-radio:hover>input[type="radio"] + .c-radio__label::before {
  border-color: var(--form-default-bg);
}

/* focus */
.c-check>input[type="checkbox"]:focus-visible + .c-check__label::before,
.c-radio>input[type="radio"]:focus-visible + .c-radio__label::before {
  outline: 2px solid var(--form-select-bg);
  outline-offset: 2px;
}

/* checked */
.c-check>input[type="checkbox"]:checked + .c-check__label::before {
  background-color: var(--form-select-bg);
  border-color: var(--form-select-bg);
}

.c-radio>input[type="radio"]:checked + .c-radio__label::before {
  border-color: var(--form-select-bg);
  background-color: var(--form-select-bg);
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3QgeD0iMi41IiB5PSIyLjUiIHdpZHRoPSIxNSIgaGVpZ2h0PSIxNSIgcng9IjcuNSIgZmlsbD0id2hpdGUiLz4KPHJlY3QgeD0iMi41IiB5PSIyLjUiIHdpZHRoPSIxNSIgaGVpZ2h0PSIxNSIgcng9IjcuNSIgc3Ryb2tlPSIjRjg4ODAwIiBzdHJva2Utd2lkdGg9IjUiLz4KPC9zdmc+Cg==");
}

/* disabled */
.c-check>input[type="checkbox"]:disabled + .c-check__label::before,
.c-radio>input[type="radio"]:disabled + .c-radio__label::before {
  background-color: #f3f3f3;
  border-color: #ddd;
}

.c-check>input[type="checkbox"]:disabled + .c-check__label,
.c-radio>input[type="radio"]:disabled + .c-radio__label {
  color: #999;
}