@charset "utf-8";
/* itenjoy 220629 */
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url("https://fonts.googleapis.com/earlyaccess/notosanskr.css");
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,700;1,900&display=swap');

/*reset*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button{margin:0;padding:0;}
html {height:100vh; }
body {
	height:100vh;
	background-color: #eaedef;
}
a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {color: #009cff; text-decoration:none; }
a:active {text-decoration:none;}
img{border:0px;}
/* img, a, label, span{vertical-align:middle; margin-bottom: 0;} */
li{list-style: none;}
table{border-collapse:separate;width:100%;}
address,caption,cite,code,dfn,em,var,h1,h2,h3,h4,h5,h6 {font-style:normal;font-weight:normal;}
caption,legend,caption *,legend *{position:absolute; left:-10000px; line-height:0; font-size:0;}
fieldset{border:solid 0px black;padding:0;}

body,a,[type=text], [type=password], [type=file], [type=email], [type=number], [type=tel],select,h1, h2, h3, h4, h5, h6, pre,textarea{
font-family:"Roboto"/* ,"Noto Sans KR","nanumGothic","돋움","tahoma" */,"sans-serif"; font-size:14px; line-height:1.2; color:#666; letter-spacing:-0.05em}

[type=text], [type=password], [type=file], [type=email], [type=number], [type=tel]{padding-left:10px; box-sizing:border-box; vertical-align:middle; border:solid 1px #ddd; background-color:#fff; height:25px; line-height:25px;}
[type=checkbox], [type=radio]{vertical-align:middle;margin:6px 4px 4px 4px;}

textarea{resize:none;}

textarea::placeholder {
    font-size: 12px;
    color: #b0b0b0;
}
input::placeholder {
    font-size: 12px;
    color: #b0b0b0;
}

input,
textarea {
	outline:none !important;
	background-color: #fff;
}

input:focus,
select:focus,
option:focus,
textarea:focus,
button:focus {
	outline:none !important;
}

input:focus,
textarea:focus {
	border: 1px solid #00baeb;
	box-shadow: 0 0 2px 2px rgba(0,0,0,0.1);
}

label {
	font-weight: normal;
}

button {
	background-color: transparent;
	border: 0;
	cursor: pointer;
}

button:focus {
	outline: 0;
}

/* scrollbar custom */
/*스크롤바 넓이*/
html::-webkit-scrollbar,
div::-webkit-scrollbar,
ul::-webkit-scrollbar {
	width:15px; height: 15px;
}

/*스크롤바 막대 설정*/
html::-webkit-scrollbar-thumb,
div::-webkit-scrollbar-thumb,
ul::-webkit-scrollbar-thumb {
  	background-color: rgba(0,0,0,0.4); /*스크롤바 막대 색상*/
 	border-radius:10px;  /*스크롤바 막대 모서리 둥글리기*/
  	background-clip: padding-box;
  	border: 3px solid transparent;
  	opacity : 0.7;
}

/*스크롤바 막대 배경 설정*/
html::-webkit-scrollbar-track,
div::-webkit-scrollbar-track,
ul::-webkit-scrollbar-track {
    background-color: transparent; /*스크롤바 트랙 색상*/
}
html::-webkit-scrollbar-thumb:hover,
div::-webkit-scrollbar-thumb:hover,
ul::-webkit-scrollbar-thumb:hover {
	background-color: rgba(0,0,0,0.6); /*스크롤바 막대 색상*/
}

input[type="file"] {
	height: 41px;
    padding: 4px;
    border-radius: 3px;
    box-sizing: border-box;
}

/* 라디오버튼 버튼 교체 */
.checks input[type="radio"] {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip:rect(0,0,0,0);
	border: 0;
}
.checks input[type="radio"] + label {
	position: relative;
	z-index: 20;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	min-width: 45px;
	height: 32px;
	margin-right: -1px;
	padding: 0 10px;
	text-align: center;
	font-size: 12px;
	color: #2d2d2d;
	background: #fafafa;
	border: 1px solid #929292;
	box-shadow: 0px 1px 2px rgba(0,0,0,0.05),
	inset 0px -15px 10px -12px rgba(0,0,0,0.05);
    -webkit-appearance: radio; /* 아이폰 iOS/사파리 배경 문제 해결 */
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}
.checks input[type="radio"] + label:first-child {
	border-top-left-radius: 32px;
	border-bottom-left-radius: 32px;
}
.checks input[type="radio"]:checked + label {
	color: #fff;
	background-color: #5f6270;
    border: 1px solid #5f6271;
}
.checks input[type="radio"]:checked + label .Lblue {
	color: #c9e4ff !important;
}
.checks input[type="radio"]:checked + label .red {
	color: #ffc6b9 !important;
}
.checks input[type="radio"] + label.checksWide {
	width: 183px;
}
.checks input[type="radio"] + label span {
	display: flex;
	flex-shrink: 0;
}

/*
.checks input[type="radio"]:checked + label:after {
	content: '';
	position: absolute;
	z-index: 30;
	top: 50%;
	left: 6px;
    width: 12px;
    height: 12px;
    margin-top: -6px;
	background: #5490bd;
	border-radius: 100%;
	box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3);
}
*/

/* radio size */
.checks.small input[type="radio"] + label {
  	font-size: 12px;
  	padding-left: 25px;
}
.checks.small input[type="radio"] + label:before {
    top: -2px;
  	width: 17px;
  	height: 17px;
}
.checks.small input[type="radio"]:checked + label:after {
    top: 3px;
  	width: 9px;
  	height: 9px;
}


/* 체크박스 버튼 교체 */
.checks input[type="checkbox"] {  /* 실제 체크박스는 화면에서 숨김 */
  position: absolute;
   width: 1px;
   height: 1px;
   padding: 0;
   margin: -1px;
   overflow: hidden;
   clip:rect(0,0,0,0);
   border: 0;
}
.checks input[type="checkbox"] + label {
    position: relative;
    display: inline-flex;
	flex-shrink: 0;
	justify-content: center;
	align-items: center;
	min-width: 45px;
	height: 32px;
	margin: 0 3px;
	padding: 0 10px 0 22px;
	text-align: center;
	font-size: 12px;
	color: #2d2d2d;
	background: #fafafa;
	border: 1px solid #aaa;
	border-radius: 5px;
	box-shadow: 0px 1px 2px rgba(0,0,0,0.05),
	inset 0px -15px 10px -12px rgba(0,0,0,0.05);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
/* 원본
 .checksDark input[type="checkbox"] + label {
    color: #fff;
    background-color: #484848;
	border: 1px solid #acacac;
} */
.checksDark input[type="checkbox"] + label {
    color: #fff;
    background-color: #181d3d;
    border: 1px solid #acacac;
}

.checks input[type="checkbox"] + label:before {  /* 가짜 체크박스 */
	position: absolute;
	top: 0;
	left: 0;
    content: ' ';
	display: inline-flex;
	justify-content: center;
	width: 17px; /* 체크박스의 너비를 지정 */
	height:30px; /* 체크박스의 높이를 지정 */
	line-height: 30px; /* 세로정렬을 위해 높이값과 일치 */
	/* margin: -2px 5px 0 0; */
	text-align: center;
	/* vertical-align: middle; */
	background: #fafafa;
	/* border: 1px solid #cacece; */
	border-right: 1px solid #aaa;
	border-radius : 5px 0 0 5px;
	box-shadow: 0px 1px 2px rgba(0,0,0,0.05),
	inset 0px -15px 10px -12px rgba(0,0,0,0.05);
    -webkit-appearance: checkbox; /* 아이폰 iOS/사파리 배경 문제 해결 */
}
/* 원본
.checksDark input[type="checkbox"] + label:before {
    background-color: #484848;
} */
.checksDark input[type="checkbox"] + label:before {
    background-color: #181d3d;
}

.checks input[type="checkbox"] + label:active:before,
.checks input[type="checkbox"]:checked + label:active:before {
  box-shadow: 0 1px 2px rgba(0,0,0,0.05),
  inset 0px 1px 3px rgba(0,0,0,0.1);
}

.checks input[type="checkbox"]:checked + label {
	background-color: #fff;
	border-color: #1d82d0;
}
.checks input[type="checkbox"]:checked + label span {
	color: #1273d7;
}

.checks input[type="checkbox"]:checked + label:before {  /* 체크박스를 체크했을때 */
  /* content: '\2714';*/  /* 체크표시 유니코드 사용 */
  content: '\ea28'; /* 체크표시 icomoon 사용 */
  font-size: 10px;
  color: #1d82d0;
  /* text-shadow: 1px 1px #fff; */
  background: #fff;
  border-color: #1d82d0;
  box-shadow: 0px 1px 2px rgba(0,0,0,0.05),
  inset 0px -15px 10px -12px rgba(0,0,0,0.05),
  inset 15px 10px -12px rgba(255,255,255,0.1);
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
}
.checksDark input[type="checkbox"]:checked + label:before {
    background: #484848;
}
.checks input[type="checkbox"] + label span {
	display: flex;
	flex-shrink: 0;
}

/* checkbox size */
.checks.small input[type="checkbox"] + label:before {
  width: 17px;
  height: 17px;
  line-height: 17px;
  font-size: 14px;
}

/* checkbox different */
.checks.etrans input[type="checkbox"] + label {
  padding-left: 30px;
}
.checks.etrans input[type="checkbox"] + label:before {
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 0;
  opacity: .6;
  box-shadow: none;
  border-color: #6cc0e5;
  -webkit-transition: all .12s, border-color .08s;
  transition: all .12s, border-color .08s;
}

.checks.etrans input[type="checkbox"]:checked + label:before {
  position: absolute;
  content: "";
  width: 10px;
  top: -5px;
  left: 5px;
  border-radius: 0;
  opacity:1;
  background: transparent;
  border-color:transparent #6cc0e5 #6cc0e5 transparent;
  border-top-color:transparent;
  border-left-color:transparent;
  -ms-transform:rotate(45deg);
  -webkit-transform:rotate(45deg);
  transform:rotate(45deg);
}

.no-csstransforms .checks.etrans input[type="checkbox"]:checked + label:before {
  /*content:"\2713";*/
  content: "\2714";
  top: 0;
  left: 0;
  width: 21px;
  line-height: 21px;
  color: #6cc0e5;
  text-align: center;
  border: 1px solid #6cc0e5;
}

/* checkbox Set */
ul.checkboxSetList {
	position: relative;
	display: flex;
	flex-wrap: wrap;
}
ul.checkboxSetList li {
	display: flex;
	padding: 5px;
	box-sizing: border-box;
}
.checkboxSetList input[type="checkbox"] {  /* 실제 체크박스는 화면에서 숨김 */
  position: absolute;
   width: 1px;
   height: 1px;
   padding: 0;
   margin: -1px;
   overflow: hidden;
   clip:rect(0,0,0,0);
   border: 0;
}
.checkboxSetList input[type="checkbox"] + label {
    position: relative;
    display: inline-flex;
	flex-direction: column;
	flex-shrink: 0;
	justify-content: center;
	align-items: center;
	max-width: 180px;
	min-height: 32px;
	margin: 0;
	padding: 20px;
	text-align: center;
	font-size: 12px;
	color: #2d2d2d;
	background-color: #f9f9f9;
	border: 1px solid #2c7dba;
	border-radius: 5px;
	box-shadow: 0px 1px 2px rgba(0,0,0,0.05),
	inset 0px -15px 10px -12px rgba(0,0,0,0.05);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
	cursor: pointer;
}
.checkboxSetList .blue input[type="checkbox"] + label {
	background-color: #4a94cd;
	border: 1px solid #2c7dba;
}
.checkboxSetList .green input[type="checkbox"] + label {
	background-color: #1bbf69;
	border: 1px solid #10944f;
}
.checkboxSetList .orange input[type="checkbox"] + label {
	background-color: #dcbd54;
	border: 1px solid #c0a13a;
}
.checkboxSetList .purple input[type="checkbox"] + label {
	background-color: #9a54dc;
	border: 1px solid #7333af;
}
.checkboxSetList input[type="checkbox"] + label span {
	color: #fff;
}
/*
.checkboxSetList .blue input[type="checkbox"] + label span {
	color: #bae1ff;
}
*/
.checkboxSetList .green input[type="checkbox"] + label span {
	font-size: 14px;
    line-height: 1.5;
    text-shadow: 1px 1px 2px grey;
	color: #d5ffe9;
}
/*
.checkboxSetList .orange input[type="checkbox"] + label span {
	color: #bae1ff;
}
.checkboxSetList .purple input[type="checkbox"] + label span {
	color: #bae1ff;
}
*/
.checkboxSetList input[type="checkbox"] + label:before {  /* 가짜 체크박스 */
	position: absolute;
	top: 0;
	left: 0;
    content: ' ';
	display: inline-flex;
	justify-content: center;
	width: 0; /* 체크박스의 너비를 지정 */
	height: 0; /* 체크박스의 높이를 지정 */
	line-height: 30px; /* 세로정렬을 위해 높이값과 일치 */
	/* margin: -2px 5px 0 0; */
	text-align: center;
	/* vertical-align: middle; */
	background: #0b5995;
	/* border: 1px solid #cacece; */
	/* border-right: 1px solid #aaa; */
	border-radius : 5px 0 0 5px;
	box-shadow: 0px 1px 2px rgba(0,0,0,0.05),
	inset 0px -15px 10px -12px rgba(0,0,0,0.05);
    -webkit-appearance: checkbox; /* 아이폰 iOS/사파리 배경 문제 해결 */
}

.checkboxSetList input[type="checkbox"] + label:active:before,
.checkboxSetList input[type="checkbox"]:checked + label:active:before {
  box-shadow: 0 1px 2px rgba(0,0,0,0.05),
  inset 0px 1px 3px rgba(0,0,0,0.1);
}

/*
.checkboxSetList .blue input[type="checkbox"]:checked + label {
	background-color: #0b5995;
	border-color: #105777;
	box-shadow: 3px 3px 2px rgba(0,0,0,0.05),
    inset 3px 3px 3px 2px rgba(0, 0, 0, 0.4);
}
*/
.checkboxSetList .green input[type="checkbox"]:checked + label {
	background-color: #13884b;
	border-color: #217a53;
	box-shadow: 3px 3px 2px rgba(0,0,0,0.05),
    inset 3px 3px 3px 2px rgba(0, 0, 0, 0.4);
}
/*
.checkboxSetList .orange input[type="checkbox"]:checked + label {
	background-color: #aa870f;
	border-color: #7a610c;
	box-shadow: 3px 3px 2px rgba(0,0,0,0.05),
    inset 3px 3px 3px 2px rgba(0, 0, 0, 0.4);
}
.checkboxSetList .purple input[type="checkbox"]:checked + label {
	background-color: #790faa;
	border-color: #560c78;
	box-shadow: 3px 3px 2px rgba(0,0,0,0.05),
    inset 3px 3px 3px 2px rgba(0, 0, 0, 0.4);
}
*/
/*
.checkboxSetList input[type="checkbox"]:checked + label span {
	color: #fff;
}
.checkboxSetList .blue input[type="checkbox"]:checked + label span {
	color: #fff;
}
*/
.checkboxSetList .green input[type="checkbox"]:checked + label span {
	color: #c5ffe1;
}
/*
.checkboxSetList .orange input[type="checkbox"]:checked + label span {
	color: #fff;
}
.checkboxSetList .purple input[type="checkbox"]:checked + label span {
	color: #fff;
}
*/

.checkboxSetList input[type="checkbox"]:checked + label:before {  /* 체크박스를 체크했을때 */
  /* content: '\2714';*/  /* 체크표시 유니코드 사용 */
  /* content: '\ea28';*/ /* 체크표시 icomoon 사용 */
  content: "";
  font-size: 10px;
  color: #1d82d0;
  /* text-shadow: 1px 1px #fff; */
  background: #fff;
  border-color: #1d82d0;
  box-shadow: 0px 1px 2px rgba(0,0,0,0.05),
  inset 0px -15px 10px -12px rgba(0,0,0,0.05),
  inset 15px 10px -12px rgba(255,255,255,0.1);
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
}
.checkboxSetList input[type="checkbox"] + label span {
	display: flex;
	flex-shrink: 0;
}

.setTitleBox {
	position: relative;
	display: flex;
	margin-top: auto;
	font-size: 20px !important;
	font-weight: bold;
	color: #fff !important;
	padding: 20px 0 0;
}

/* checkbox click */
.checks.clicks input[type="checkbox"] + label {
    position: relative;
    z-index: 20;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 32px;
    height: 32px;
    margin: 0 3px;
    padding: 3px 2px 0 0;
    text-align: center;
    background: #fafafa;
    border: 1px solid #d3d3d3;
	border-radius: 50%;
    box-shadow: 0px 1px 2px rgb(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgb(0, 0, 0, 0.05);
    -webkit-appearance: checkbox;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    box-sizing: border-box;
	cursor: pointer;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.checks.clicks input[type="checkbox"] + label {
		padding: 0;
	}
} /* IE10 & IE11 */

.checks.clicks input[type="checkbox"]:checked + label {
    color: #fff;
    background: #00baeb;
    border: none;
    box-sizing: border-box;
}
.checks.clicks input[type="checkbox"] + label:before,
.checks.clicks input[type="checkbox"]:checked + label:before {
	width: 0;
	height: 0;
	margin: 0;
	background-color: transparent;
	border: none;
	content: "";
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.checks.clicks input[type="checkbox"]:checked + label {
    	color: #fff;
    	background: #00baeb;
    	border: none;
    	box-sizing: border-box;
	}
} /* IE10 & IE11 */

ul.checkList {
	display: inline-flex;
	margin: 0 5px;
}
ul.checkList li {
	position: relative;
	display: inline-flex;
	align-items: center;
}

ul.checkList li:first-child input[type="radio"] + label {
	border-top-left-radius: 32px;
	border-bottom-left-radius: 32px;
}

ul.checkList li:last-child input[type="radio"] + label {
	border-top-right-radius: 32px;
	border-bottom-right-radius: 32px;
}

/*토글 스위치 적용 */
.switcher {
	position:relative;
	width:42px;
	height:18;
	margin-left: 5px;
	border-radius:32px;
}
.switcher input {
	-webkit-appearance: none;
	appearance: none;
	position: relative;
	width: 42px;
	height: 18px;
	margin: 0;
	border-radius: 32px;
	background-color: #3e82e1;
	border:1px solid #fff;
}
.switcher input:before, .switcher input:after {
	z-index: 2;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
/*토클 바 (head)*/
.switcher label {
	z-index:1;
	position:absolute;
	top: 2px;
	width: 16px;
	height: 16px;
	border-radius:24px;
	background-color: #fff;
}
/*토글 선택 활성화시*/
.switcher input:checked:before {
	position: absolute;
	z-index: 0;
	top: 8px;
	left: 0;
	width: 42px;
	height: 18px;
	border-radius: 32px;
	background-color: #00c0ff;
	content: "";
}
/*토글바가 좌측으로 이동시*/
.switcher input:checked + label {
	left: 2px;
	right: 0;
	-webkit-transition: left 0.5s, right 0.4s 0.2s;
	-moz-transition: left 0.5s, right 0.4s 0.2s;
	-ms-transition: left 0.5s, right 0.4s 0.2s;
	-o-transition: left 0.5s, right 0.4s 0.2s;
	transition: left 0.5s, right 0.4s 0.2s;
}
/*토글 선택 활성화시*/
.switcher input:not(:checked):after {
	position: absolute;
	z-index: 0;
	top: 8px;
	left: 0;
	width: 42px;
	height: 18px;
	border-radius: 32px;
	background-color: #acacac;
	content: "";
}
.customerMypage .switcher input:not(:checked):after {
	background-color: #34c9e9;
}
/*토글바가 우측 이동시*/
.switcher input:not(:checked) + label {
	left: 26px;
	right: 0;
	-webkit-transition: left 0.4s 0.2s, right 0.5s;
	-moz-transition:left 0.4s 0.2s, right 0.5s;
	-ms-transition:left 0.4s 0.2s, right 0.5s;
	-o-transition:left 0.4s 0.2s, right 0.5s;
	transition:left 0.4s 0.2s, right 0.5s;
}

/* selectBox */
.select {
	padding: 2px 0;
	font-size: 13px;
	border: 1px solid #dedede;
}
.selectBox {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
  min-width: 40px;
  height: 30px;
  border-radius: 4px;
  background-color: #fff;
  border: 1px solid #aaa;
}
/* 원본
 .selectDark {
  color: #fff;
  background-color: #484848;
  border: 1px solid #acacac;
} */
.selectDark {
    color: #fff;
    background-color: #181d3d;
    border: 1px solid #acacac;
}

.selectBox .select {
  	position: relative;
  	z-index: 3; /* select가 위로 올라와야 함 */
  	width: 100%;
  	height: inherit;
  	padding: 0 30px 0 5px;
	font-size: 13px;
  	background: transparent;
  	box-shadow: 0px 1px 2px rgb(0,0,0,0.15),
                inset 0px -15px 10px -12px rgb(0,0,0,0.15);
  	border: 0 none;
  	outline: 0 none;
  	-webkit-appearance: none;  /* 네이티브 외형 감추기 */
  	-moz-appearance: none;
  	appearance: none;
}
.selectDark .select {
    color: #fff;
}
.selectBox .select option {
  	color: #2d2d2d;
  	padding: 3px 0;
  	font-size: 13px;
}
.selectBox .icoArrow {
  	position: absolute;
	z-index: 1;
  	top: 6px;
  	right: 0;
	display: flex;
  	justify-content: center;
  	align-items: center;
  	width: 25px;
  	height: 17px;
  	font-size: 10px;
  	border-left: 1px solid #aaa;
}
.selectBox .icoArrow span {
	display: block;
	text-indent: -9999px;
}
.selectBox .icoArrow:before {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    display: flex;
	justify-content: center;
	align-items: center;
    width: 23px;
    height: 18px;
    font-size: 10px;
    color: #2d2d2d;
    content: "\e90c";
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    transition: .3s; /* 부드럽게 회전 */
}
.selectDark .icoArrow:before {
    color: #fff;
}
.selectBox .select:focus + .icoArrow:before {
  	transform: rotate(180deg);
}

/* 버튼 */
.btnBox {
	position: relative;
    font-size: 12px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-width: 65px;
    height: 20px;
    padding: 0 7px;
    color: #666666;
    background-color: #fff;
    border: 1px solid #666666;
    border-radius: 32px;
    box-sizing: border-box;
    font-family: 'Roboto', sans-serif;
}

a.btnMore {
	position:relative;
	padding:2px 5px;
	font-size:12px;
	color:#fff;
	background-color:#e36204;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	border-radius:3px;
}


/* 텍스트 색상 */
.blue { color:#004c99 !important;}
.Lblue { color:#639bd5 !important; }
.red { color:#ff3000 !important;}
.Lyellow { color:#ffeb00 !important; }
.yellow { color:#fed030 !important; }
.Dyellow { color:#997300 !important; }
.green { color:#14972d !important; }
.Lgreen { color:#f2fff4 !important; }
.black { color:#000 !important; }
.purple { color: #b10be1 !important; }
.Lpink { color:#ffd0dc !important; }
.orange { color:#ff3000 !important; }
.Lorange { color: #ffa25f !important; }
.white { color:#fff !important; }
.Lgrey { color:#9d9d9d !important; }
.grey { color:#7a7a7a !important; }
.Dgrey { color:#575757 !important; }

/* 링크 색상 */
a.blue { color:#004c99 !important;}
a.Lblue { color:#007eff !important; }
a.red { color:#ff3000 !important;}
a.yellow { color:#fed030 !important; }
a.Dyellow { color:#997300 !important;; }
a.green { color:#14972d !important; }
a.black { color:#000 !important; }
a.white { color:#fff !important; }

/* 백그라운드 색상 */
.Bblue { background-color:#007eff !important; }
.BLblue { background-color:#ebf5ff !important; }
.Bgrey { background-color:#f0f0f0 !important; }
.BLgrey { background-color:#f9f9f9 !important; }
.BLyellow { background-color:#ffea00 !important; }
.BLyellow2 { background-color:#ffffa1 !important; }
.BLgreen { background-color:#fafff3 !important; }
.Bwhite { background-color:#fff !important; }

/* 텍스트 */
.FS11 { font-size:11px !important; }
.FS12 { font-size:12px !important; }
.FS14 { font-size:14px !important; }
.FS16 { font-size:16px !important; }
.FS18 { font-size:18px !important; }
.FS20 { font-size:20px !important; }
.FS24 { font-size:24px !important; }
.FS28 { font-size:28px !important; }
.FS32 { font-size:32px !important; }
.FS42 { font-size:42px !important; }
.FS52 { font-size:52px !important; }
.B { font-weight:bold !important; }
.FWN { font-weight:normal !important; }
.TDUL { text-decoration:underline !important; text-underline-position: under !important; }

/* 레이아웃 */
.TAL { text-align:left !important; }
.TAC { text-align:center !important; }
.TAR { text-align:right !important; }
.VAT { vertical-align:top !important; }
.VAM { vertical-align:middle !important; }
.DF { display:flex !important; }
.DIF { display:inline-flex !important; }
.JCFS {justify-content: flex-start !important; }
.JCFC {justify-content: center !important; }
.JCFE {justify-content: flex-end !important; }
.AIFS {align-items: flex-start !important; }
.AIC {align-items: center !important; }
.AIB {align-items: baseline !important; }
.AIFE {align-items: flex-end !important; }
.FDC {flex-direction: column !important; }
.FDR {flex-direction: row !important; }
.FWW {flex-wrap: wrap !important; }
.FS0 {flex-shrink: 0 !important; }
.FG1 {flex-grow: 1 !important; }
.MLA {margin-left: auto !important; }
.MTA {margin-top: auto !important; }
.DB { display:block !important; }
.DIB { display:inline-block !important; }
.FL { float:left !important; }
.FR { float:right !important; }
.PR {position: relative; }

/* 크기 */
.WA { width: auto !important; }
.W10 { width:10% !important; }
.W15 { width:15% !important; }
.W20 { width:20% !important; }
.W25 { width:25% !important; }
.W30 { width:30% !important; }
.W35 { width:35% !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; }
.H100 { height:100% !important; }
.W10P { width:  10px !important; }
.W15P { width:  15px !important; }
.W20P { width:  20px !important; }
.W30P { width:  30px !important; }
.W40P { width:  40px !important; }
.W50P { width:  50px !important; }
.W60P { width:  60px !important; }
.W80P { width:  80px !important; }
.W90P { width:  90px !important; }
.W100P { width:  100px !important; }
.W110P { width:  110px !important; }
.W120P { width:  120px !important; }
.W130P { width:  130px !important; }
.W140P { width:  140px !important; }
.W150P { width:  150px !important; }
.W200P { width:  200px !important; }
.W250P { width:  250px !important; }
.W300P { width:  300px !important; }
.W400P { width:  400px !important; }
.W500P { width:  500px !important; }
.W680P { width:  680px !important; }

/* 높이 */
.H24 { height: 24px !important; }
.H32 { height: 32px !important; }
.MH24 { min-height: 24px !important; }
.MH32 { min-height: 32px !important; }

/* 마진 */
.M3 { margin:3px !important; }
.M5 { margin:5px !important; }
.M10 { margin:10px !important; }
.M20 { margin:20px !important; }
.M30 { margin:30px !important; }
.M40 { margin:40px !important; }
.M50 { margin:50px !important; }
.MT0 { margin-top:0 !important; }
.MT2 { margin-top:2px !important; }
.MT5 { margin-top:5px !important; }
.MT8 { margin-top:8px !important; }
.MT10 { margin-top:10px !important; }
.MT20 { margin-top:20px !important; }
.MT30  { margin-top:30px !important; }
.MT40  { margin-top:40px !important; }
.MT50 { margin-top:50px !important; }
.MTB5 { margin-top:5px !important; margin-bottom: 5px !important; }
.MTB10 { margin-top:10px !important; margin-bottom: 10px !important; }
.MR5 { margin-right:5px !important; }
.MR8 { margin-right:8px !important; }
.MR10 { margin-right:10px !important; }
.MR15 { margin-right:15px !important; }
.MR20 { margin-right:20px !important; }
.MR30  { margin-right:30px !important; }
.MB-5 { margin-bottom:-5px !important; }
.MB2 { margin-bottom:2px !important; }
.MB5 { margin-bottom:5px !important; }
.MB10 { margin-bottom: 10px !important; }
.MB15 { margin-bottom: 15px !important; }
.MB20 { margin-bottom: 20px !important; }
.MB30 { margin-bottom: 30px !important; }
.MB40 { margin-bottom: 40px !important; }
.MB50 { margin-bottom: 50px !important; }
.ML5 { margin-left:5px !important; }
.ML10 { margin-left:10px !important; }
.ML15 { margin-left:15px !important; }
.ML20 { margin-left:20px !important; }
.ML30  { margin-left:30px !important; }
.MRL5 { margin-right:5px !important; margin-left:5px !important; }
.MRL10 { margin-right:10px !important; margin-left:10px !important; }
.MRL15 { margin-right:15px !important; margin-left:15px !important; }
.MRL20 { margin-right:20px !important; margin-left:20px !important; }
.MRL30 { margin-right:30px !important; margin-left:30px !important; }
.MRL40 { margin-right:40px !important; margin-left:40px !important; }
.MLA { margin-left: auto !important; }
.MTA { margin-top: auto !important; }


/* 패딩 */
.P5 { padding:5px !important; }
.P10 { padding:10px !important; }
.P15 { padding:15px !important; }
.P20 { padding:20px !important; }
.P30 { padding:30px !important; }
.P40 { padding:40px !important; }
.P50 { padding:50px !important; }
.PT0 { padding-top:0px !important; }
.PT5 { padding-top:5px !important; }
.PT10 { padding-top:10px !important; }
.PT20 { padding-top:20px !important; }
.PT30  { padding-top:30px !important; }
.PT40  { padding-top:40px !important; }
.PT50 { padding-top:50px !important; }
.PR5 { padding-right:5px !important; }
.PR10 { padding-right:10px !important; }
.PR20 { padding-right:20px !important; }
.PR30  { padding-right:30px !important; }
.PB5 { padding-bottom:5px !important; }
.PB10 { padding-bottom: 10px !important; }
.PB20 { padding-bottom: 20px !important; }
.PB30 { padding-bottom: 30px !important; }
.PB40 { padding-bottom: 40px !important; }
.PB50 { padding-bottom: 50px !important; }
.PL0 { padding-left:0 !important; }
.PL5 { padding-left:5px !important; }
.PL10 { padding-left:10px !important; }
.PL15 { padding-left:15px !important; }
.PL20 { padding-left:20px !important; }
.PL30  { padding-left:30px !important; }
.PR15 { padding-right:15px !important; }
.PRL5 { padding-right:5px !important; padding-left:5px !important; }
.PRL10 { padding-right:10px !important; padding-left:10px !important; }
.PRL15 { padding-right:15px !important; padding-left:15px !important; }
.PRL20 { padding-right:20px !important; padding-left:20px !important; }
.PRL30 { padding-right:30px !important; padding-left:30px !important; }

.DPN {display:none !important;}