@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url("https://fonts.googleapis.com/css?family=Open+Sans");
@import url("https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&display=swap");
:root {
	--font_main: #615fff;
	--font_black: #1d1d1dd9;
	--font_darkgray: #424242;
	--font_bright: #ffffff;
	
	--bt_Y: linear-gradient(334deg, #4381d6eb, #54ccffe6);
	--bt_N: linear-gradient(334deg, #d64392eb, #ff6d54e6);
	--bt_B: #cccccc;
  
	--col_line: #444444;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  min-height: 0;
}

.input-excel {
  width: 100%;
  height: 100%;
  padding: 10px 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 30px;
  background-color: #cc306e;
  color: white;
  box-shadow: 0 0 3px 0px black;
  transform: rotate(-0.03deg);
}
#butDownExcel {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
}
.exceldownguide {
  width: 98%;
  height: 35px;
  padding: 0 0 3px 0;
  display: flex;
  font-size: 11pt;
  letter-spacing: -0.4px;
  font-weight: 400;
  transform: rotate(-0.03deg);
  align-items: center;
  justify-content: center;
}
/*
.input-excel:hover{
    width:100%;
    height: 100%;
	cursor: pointer;
    border-style: solid;
    padding: calc(1% + 6px) calc(3% - 4px);
    border-width: 4px;
    border-color: #cc306e;
    align-content: center;
    background-image: url(/images/.png);
    background-repeat: no-repeat;
    background-size: 66px;
    background-position: center;
}
*/
#frmExcel {
  height: 40%;
  width: 32%;
  display: flex;
  align-items: center;
  font-size: 11pt;
  margin: 0 10px;
}

html {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px;
}

textarea {
  padding: 7px 7px;
  font-size: 100%;
  color: var(--font_black);

  height: auto;
  line-height: 170%;
  font-family: inherit;
  border: 1px solid var(--col_line);
  outline-style: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;

  background-color: transparent;
}

#DropZone {
  position: relative;
  width: 280px;
  height: 170px;
  background-color: #555555;
  margin: 20px 0;
  background-image: url(/images/upload.png);
  background-repeat: no-repeat;
  background-position: center;
  background-blend-mode: difference;
}
.user_infoadd {
  width: 100%;
  padding: 0 4%;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  height: 200px;
  line-height: 100%;
}
.user_info_names {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: space-around;
}
.user_info_name {
  width: 100%;
  height: 30%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.user_info_name_group {
  width: 20%;
  transform: rotate(-0.03deg);
  font-weight: 500;
  font-size: 13pt;
  letter-spacing: -0.5px;
  display: flex;
  flex-direction: column;
}
.user_popupname {
  text-align: center;
  font-size: 14pt;
  transform: rotate(-0.03deg);
  font-weight: 600;
  width: 100%;
  margin-top: 10px;
  height: 65px;
  line-height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.user_popupnameSub {
  font-size: 10pt;
  font-weight: 300;
  margin-top: 0px;
  height: 30px;
}
.user_info_catgory {
  width: 70%;
  height: 100%;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  align-content: center;
}
.cate_style {
  width: 70%;
  display: flex;
  padding: 9px 25px 7px 25px;
  font-size: 14pt;
  border-radius: 50px;
  border-width: 0;
  box-shadow: 0 0 4px #0000009e;
  align-items: center;
  height: auto;
  line-height: 100%;
}

#select_rig {
  width: 70%;
  display: flex;
  padding: 9px 25px 7px 25px;
  font-size: 14pt;
  border-radius: 50px;
  border-width: 0;
  box-shadow: 0 0 4px #0000009e;
  align-items: center;
  height: auto;
  line-height: 100%;
}
#cur_cate_parent {
  width: 100%;
  height: auto;
  font-weight: 500;
  font-size: 10pt;
  line-height: 100%;
  line-height: 160%;
  color: #cc306e;
  padding: 20px 6px 10px 10px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  transform: rotate(-0.03deg);
}
#cate_parent_route {
  width: 100%;
  border-width: 0;
  border-radius: 8px;
  padding: 10px 6px 10px 10px;
  box-shadow: 0 0 4px #0000009e;
}
#cate_parent_route::-webkit-scrollbar {
  width: 4px;
}

#cate_parent_route::-webkit-scrollbar-thumb {
  background-color: #d3d3d3d4;
  border-radius: 10px;
  height: 30%;
}

#cate_parent_route::-webkit-scrollbar-track {
  background-color: #a5a5a500;
  border-radius: 10px;
}

.c_cate {
  font-size: 12pt;
  width: 70%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.user_add {
  width: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  height: 100%;
  line-height: 100%;
}

.exceladd_body {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}
.exceladd_group {
  width: 92%;
  height: calc(100% - 145px);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: flex-start;
}
.exceladd_group_abstract {
  width: 100%;
  height: 30%;
  display: flex;
  align-items: center;
  flex-direction: row;
}

#tdConList {
  width: 100%;
  height: calc(100% - 30px);
  line-height: 100%;
  max-height: 200px;
  overflow: auto;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  flex-wrap: nowrap;
  background-color: #e7e7e7;
  border-radius: 0 0 10px 10px;
  padding: 11px 6px 0 10px;
  color: #9b9b9b;
}
#tdConList::-webkit-scrollbar {
  width: 4px;
}

#tdConList::-webkit-scrollbar-thumb {
  background-color: #cc306e;
  border-radius: 10px;
  height: 30%;
}

#tdConList::-webkit-scrollbar-track {
  background-color: #a5a5a500;
  border-radius: 10px;
}

.adduserinfo_group::-webkit-scrollbar {
  height: 6px;
}

.adduserinfo_group::-webkit-scrollbar-thumb {
  background-color: #d3d3d3d4;
  border-radius: 10px;
  height: 30%;
}

.adduserinfo_group::-webkit-scrollbar-track {
  background-color: #a5a5a500;
  border-radius: 4px;
}

.formgroup {
  display: flex;
  width: 100%;
  height: 100%;
  line-height: 100%;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-content: stretch;
  align-items: center;
}
.categoryitems_group {
  display: flex;
  width: fit-content;
  text-align: center;
  height: 30px;
  background: #625a5a;
  color: #e7e7e7;
  z-index: 1;
  padding: 8px 6px 5px 10px;
  border-radius: 11px 11px 0 0;
  box-shadow: 0px 2px 2px #0000005c;
  flex-direction: row;
  align-content: center;
  flex-wrap: nowrap;
}
.categoryitems {
  width: 100px;
  min-width: 100px;
  max-width: 100px;
  height: 100%;
  margin-right: 20px;
  text-align: left;
  line-height: 100%;
  display: inline-block;
  white-space: nowrap;
  align-items: center;
  text-overflow: ellipsis;
  word-break: break-all;
  overflow: hidden;
  font-size: 10pt;
  font-weight: 400;
  transform: rotate(-0.03deg);
  letter-spacing: -0.7px;
}
.abstract_name {
  width: 20%;
}

table,
td {
  width: 92%;
  border: 0px;
}
.exceladd_user {
  display: flex;
  width: 100%;
  min-height: auto;
  font-size: 10pt;
  letter-spacing: -1px;
  font-weight: 400;
  color: #363636;
  transform: rotate(-0.03deg);
  margin-bottom: 8px;
  justify-content: space-between;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  align-items: center;
}
#excel_empty {
  display: flex;
  height: calc(100% - 4px);
  width: calc(100% - 4px);
  align-items: center;
  justify-content: center;
  padding-bottom: 20px;
  transform: rotate(-0.03deg);
}
.exceladd_user_item {
  font-weight: 500;
  height: 100%;
  line-height: 100%;
  display: flex;
  align-items: center;
  transform: rotate(-0.03deg);
}
.adduserinfo_group {
  display: flex;
  width: 100%;
  height: 100%;
  flex-direction: column;
  border-radius: 11px;
  box-shadow: 0 0 6px #00000080;
}
.adduserinfo_items {
  display: flex;
  width: calc(100% + 0px);
  background: #625a5a;
  color: #e7e7e7;
  z-index: 1;
  padding: 3px 6px 5px 10px;
  border-radius: 11px 11px 0 0;
  align-items: center;
  align-content: center;
  justify-content: space-between;
  box-shadow: 0px 1px 2px #0000005c;
}
#__id_base_iframe_dialog_iframeobj_freestyle {
  /*box-shadow: 0 0 13px #0000009e;
    border-radius: 28px;*/
}
.loginbase {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 4%;
}
.loginclose {
  width: 100%;
  display: flex;
  height: 6vw;
  justify-content: flex-end;
  align-items: center;
}
.loginselect {
  display: flex;
  width: 80%;
  height: 12vw;
  align-items: center;
  justify-content: center;
  font-size: 3.4vw;
  letter-spacing: -0.5px;
  font-weight: 600;
  margin-bottom: 10px;
  border-radius: 2vw;
  box-shadow: #00000057 0px 0px 3px 1px;
}
.logininfotext {
  text-align: center;
  font-size: 3.2vw;
  height: auto;
  line-height: 140%;
  letter-spacing: -0.5px;
  padding: 20px 10% 30px 10%;
  word-break: keep-all;
  transform: rotate(-0.03deg);
}
.butU {
  border-radius: 2vw 0 0 2vw;
  background: #cd326b;
  color: white;
  transform: rotate(-0.03deg);
  width: 50%;
  height: 100%;
  line-height: 100%;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.butM {
  border-radius: 0 2vw 2vw 0;
  width: 50%;
  height: 100%;
  line-height: 100%;
  text-align: center;
  background: #e9e9e9;
  transform: rotate(-0.03deg);
  display: flex;
  justify-content: center;
  align-items: center;
}
.input-wrapper {
  display: flex;
  height: 30%;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
}
#btn-login {
  width: 100%;
  height: 14vw;
  line-height: 100%;
  justify-content: center;
  background-color: white;
  color: rgb(210, 20, 119);
  font-weight: 600;
  font-size: 4.8vw;
  transform: rotate(-0.03deg);
  display: flex;
  align-items: center;
  box-shadow: rgb(0 0 0 / 44%) 0px 0px 4px;
  cursor: pointer;
  margin: 8px 0px 10px;
  border-width: 0.8vw;
  border-color: rgb(210, 20, 119);
  border-style: solid;
  border-radius: 400px;
  padding: 10px 0px;
}
h1 {
  font-weight: 500;
  font-size: 8vw;
  transform: rotate(-0.03deg);
  letter-spacing: -2px;
}
.butClose {
  position: absolute;
  filter: drop-shadow(0px 0px 2px black);
  top: 3%;
  right: 4%;
  width: 5%;
  height: auto;
  cursor: pointer;
  z-index: 2;
}

#flexbase {
}

#flowbase {
  width: 100%;
  height: 100%;
  overflow: auto;
}

#__lgpop_layer_imgshow_base {
  position: fixed;
  left: 50%;
  top: 50%;
  -ms-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);

  width: 90%;
  height: 90%;

  cursor: pointer;

  background-color: #000000;

  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

#__chang_disable_background {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
  filter: alpha(opacity=40);
  opacity: 0.4;
  background: #000;
}

#__chang_wait_div {
  position: fixed;
  width: auto;
  height: auto;
  left: 50%;
  top: 50%;
  -ms-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  color: #ffffff;
}

#__chang_wait_div #__chang_wait_percent_text {
  color: #979797;
  padding-top: 1.5rem;
  font-size: 1.2rem;
}

.__full_dialog_base {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
}

.__iframe_dialog_base {
  -webkit-user-drag: element;
  position: fixed;
  left: 10px;
  top: 10px;
  z-index: 10000;
}

#__id_base_iframe_dialog_iframeobj_freestyle body {
  margin: 0;
}

#__iframe_dialog {
  border-radius: 12px 12px 20px 20px;
  width: 100%;
  background-color: #cc306e;
  overflow: hidden;
}

#__iframe_dialog .__header {
  display: flex;
  align-items: center;
  height: 38px;
  width: 100%;
  padding: 0 4%;
  color: #ffffff;
  justify-content: space-between;
}

#__iframe_dialog .__header .__title {
  font-weight: bolder;
  font-size: 100%;
  border: none;
  padding: 3px 0px;

  flex-grow: 1;
  flex-shrink: 1;
}

#__iframe_dialog .__header .__but_close {
  flex-grow: 0;
  flex-shrink: 0;

  width: 18px;
  height: 18px;
  cursor: pointer;
  vertical-align: middle;
}

#__id_base_iframe_dialog_iframeobj {
  background-color: #666666;
}

#__yesno_dialog_base {
  position: fixed;

  min-width: 310px;
  max-width: 400px;

  left: 50%;
  top: 50%;
  -ms-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);

  border-radius: 10px;
  box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.2);

  background-color: #333333;
  color: var(--col_font_m);
  overflow: hidden;

  display: none;
}
/* 
#__alert_dialog_base {
  position: fixed;
  min-width: 310px;
  max-width: 400px;
  left: 50%;
  top: 50%;
  z-index: 10000;
  -ms-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  border-radius: 10px;
  box-shadow: 0px 0px 5px rgb(0 0 0 / 79%);
  background-color: #cc306e;
  color: #ffffff;
  overflow: hidden;
  display: none;
}
#__alert_dialog_base .__title {
  padding: 20px;
  text-align: center;
  background: #fff;
  color: #1a1a1a;
  font-size: 13pt;
  font-weight: 500;
  transform: rotate(-0.03deg);
}
.__alert_dialog_base_mob {
  width: 65%;
  height: 15%;
  min-width: auto !important;
  max-width: none !important;
} */

.pageno {
  font-size: 110%;
  padding: 20px 10px;
  text-align: center;
}

.pageno .prev {
  color: var(--col_font_s);
  cursor: pointer;
}

.pageno .next {
  margin-left: 20px;
  color: var(--col_font_s);
  cursor: pointer;
}

.pageno .num {
  margin-left: 20px;
  color: var(--col_font_m);
  cursor: pointer;
}

.pageno .curpage {
  margin-left: 20px;
  color: var(--col_font_s);
  font-size: 120%;
  font-weight: bold;
}

.imgback {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}