/********************************************************/
/*
* begin : login
*/
#ym_login {
  width: 100%;
  height: 100%;
  color: #666;
  padding: 0;
  background: #f3f5f7 url(../images/bg_login.jpg) no-repeat center;
  background-size: cover;
  overflow: auto;
}

#ym_login a {
  color: #666;
  font-weight: 400;
  letter-spacing: -0.5px;
}

#ym_login #login_cont {
  display: flex;
  min-width: 900px;
  height: 100vh;
  min-height: 630px;
  justify-content: center;
  align-items: center;
}

#ym_login #login_cont .login_box {
  position: relative;
  width: 780px;
  height: 530px;
  background: rgba(255, 255, 255, 1);
  border-radius: 8px;
  box-shadow: 4px 2px 8px 2px rgba(139, 136, 136, 0.15);
}

#ym_login #login_cont .login_box .login_left {
  position: relative;
  float: left;
  width: 320px;
  height: 100%;
  padding: 30px;
  background: #4c72dc;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.15);
  border-radius: 8px 0px 0px 8px;
}

#ym_login #login_cont .login_box .login_left h1 {
  font-weight: 500;
  font-size: 31px;
  color: #fff;
  line-height: 43px;
  margin-top: 15px;
  margin-bottom: 20px;
}

#ym_login #login_cont .login_box .login_left h1 span {
  font-size: 18px;
  font-weight: 100;
  color: rgba(255, 255, 255, 0.7);
}

#ym_login #login_cont .login_box .login_left p {
  position: absolute;
  bottom: 30px;
  font-weight: 200;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.4);
  line-height: 20px;
  letter-spacing: 1;
}

#ym_login #login_cont .login_box .login_right {
  float: right;
  width: 460px;
  position: relative;
  padding: 30px 76px 0;
}

#ym_login #login_cont .login_box .login_right h1 {
  font-size: 26px;
  font-weight: 600;
  color: #192950;
  margin-top: 10px;
  margin-bottom: 40px;
  letter-spacing: -0.5px;
}

#ym_login #login_cont .login_box .login_right ul {
  overflow: hidden;
}

#ym_login #login_cont .login_box .login_right ul li {
  letter-spacing: -0.5px;
  margin: 0;
  padding-bottom: 28px;
  overflow: hidden;
}

.login_input_div {
  height: 77px;
  overflow: hidden;
}

.login_input_div label {
  display: block;
  font-size: 12px;
  font-weight: 400;
  color: #666666;
  text-align: left;
  letter-spacing: 0;
  margin-bottom: 10px;
}

.login_input_div span {
  display: block;
  color: #f60909;
  font-size: 11px;
  margin-top: 5px;
  height: 10px;
}

.login_input_div .dash {
  display: inline-block;
  color: black;
  margin: 5px 0 15px !important;
}

.login_input_div input,
.login_input_div select {
  width: 100%;
  font-size: 13px;
  font-weight: 400;
  color: #000;
  background: transparent !important;
  border: 0px;
  border-bottom: 1px solid #c4c4c4;
  border-radius: 0px;
  padding: 5px 0 10px !important;
}

.login_input_div input[type="number"]::-webkit-outer-spin-button,
.login_input_div input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.login_input_div input:hover,
.login_input_div input:focus {
  color: #1e56b6;
  border-bottom: 1px solid #1e56b6;
}

.login_input_div input::placeholder {
  color: #a3a2a2;
  font-style: italic;
}

#ym_login #login_cont .login_box .login_right .btn_login {
  width: 100%;
  display: inline-block;
  height: 44px;
  color: #fff;
  font-weight: 400;
  text-align: center;
  font-size: 15px;
  background: #4c72dc;
  border: 0px;
  letter-spacing: 1px;
  line-height: 40px;
  border-radius: 2px;
  margin-top: -5px;
  text-decoration: none;
}

#ym_login #login_cont .login_box .login_right .btn_login:hover {
  color: #fff !important;
  background: #3e62c2;
}

#ym_login #login_cont .login_box .login_right p {
  overflow: hidden;
  padding: 5px 0;
  line-height: 18px;
}

#ym_login #login_cont .login_box .login_right p.id_div {
  margin-top: -18px;
  margin-bottom: 45px;
}

#ym_login #login_cont .login_box .login_right p .id_save {
  float: left;
}

#ym_login #login_cont .login_box .login_right p .id_save input {
  margin-top: 2px;
  vertical-align: top;
}

#ym_login #login_cont .login_box .login_right p .id_check {
  float: right;
}

#ym_login #login_cont .login_box .login_right p .id_check .bar {
  font-size: 11px;
  color: #c4c4c4;
  margin: 8px;
  vertical-align: bottom;
}

#ym_login #login_cont .login_box .login_right p.member {
  margin-top: 15px;
  text-align: center;
}

#ym_login #login_cont .login_box .login_right p.member a {
  color: #333;
  margin-left: 20px;
  font-weight: 500;
}

#ym_login #login_cont .login_box .login_right p.member a:hover {
  color: #000;
}

#ym_login #login_cont .login_box .login_box_copy {
  position: absolute;
  bottom: -32px;
  left: 0px;
  right: 0;
  font-size: 12px;
  text-align: center;
  line-height: 16px;
  color: #666;
  font-weight: 300;
  letter-spacing: 0.3px;
}

/* End : login*/

/* begin : member*/
#ym_member {
  width: 100%;
  height: 100%;
  color: #666;
  padding: 0;
  background: #f3f5f7 url(../images/bg_login.jpg) no-repeat center;
  background-size: cover;
  overflow: auto;
}

#ym_member #member_cont {
  width: 450px;
  height: 100%;
  margin: 0 auto;
  padding-top: 100px;
}

/*#ym_member #member_cont {display: flex;min-width: 450px;height: 100vh;justify-content: center;align-items: center;}*/
#ym_member #member_cont .member_box {
  position: relative;
  width: 450px;
  height: 895px;
  background: rgba(255, 255, 255, 1);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 4px 2px 8px 2px rgba(139, 136, 136, 0.15);
}

#ym_member #member_cont .member_header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 52px;
  font-size: 14px;
  color: #fff;
  font-weight: 400;
  line-height: 23px;
  background: #1e56b6;
  padding: 13px 20px;
  letter-spacing: -0.1px;
}

#ym_member #member_cont .member_header img {
  vertical-align: middle;
}

#ym_member #member_cont .member_header span {
  font-size: 13px;
  color: #baccff;
  font-weight: 300;
}

#ym_member #member_cont .member_header .s_title {
  position: absolute;
  top: 14px;
  right: 20px;
  font-size: 14px;
  color: #fff;
  font-weight: 300;
}

#ym_member #member_cont .member_body {
  height: 600px;
  margin: 65px 0 0;
  padding: 20px 60px 0;
  /*overflow: overlay;*/
}

#ym_member #member_cont .member_body ul li {
  letter-spacing: -0.5px;
  margin: 0;
  padding-bottom: 16px;
  overflow: hidden;
}

#ym_member a {
  color: #666;
  font-weight: 400;
  letter-spacing: -0.5px;
}

#ym_member #member_cont .member_bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 62px;
  text-align: center;
  border-top: 1px solid #ddd;
}

/********************************************************/
/*
* begin : layout
*/

#wrap-service {
  position: relative;
  width: 100%;
  height: 100%;
  min-width: 1260px;
  min-height: calc(100% - 60px);
  background: #ffffff;
  margin: 0px;
  padding: 0px;
  overflow: overlay;
}

#wrap-service .ym-content-body {
  width: 100%;
  height: 100%;
  padding: 60px 0 0 0;
  position: relative;
}

#wrap-service .ym-content-body .ym_layout {
  width: 1190px;
  height: auto;
  padding: 30px 0 10px 0;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
}

/** ym_header **/
#ym_header {
  width: 100%;
  z-index: 101;
  position: absolute;
  left: 0;
  top: 0;
  height: 60px;
  background: #fff;
}

#ym_header #ym_nav {
  width: 100%;
  height: auto;
  height: 60px;
  position: relative;
  overflow: hidden;
  z-index: 51;
}

#ym_header #ym_nav #gnb h1 {
  position: absolute;
  left: 0;
  width: 270px;
  height: 100%;
  background: url(../images/logo-header.svg) no-repeat left 15px;
  padding-left: 30px;
  letter-spacing: -0.2px;
}

#ym_header #ym_nav #gnb h1 a {
  /*font-family: Roboto;*/
  font-size: 16px;
  color: #333;
  font-weight: 600;
  line-height: 57px;
  letter-spacing: -0.8px;
}

#ym_header #ym_nav #gnb h1 a:hover {
  color: #192950 !important;
}

#ym_header #ym_nav #gnb h1 a span {
  font-size: 13px;
  color: #666;
  font-weight: 400;
}

#ym_header #ym_nav #gnb h1 a img {
  vertical-align: sub;
}

#ym_header #ym_nav #gnb .header_login {
  position: absolute;
  right: 0;
  top: 0;
  padding: 22px 0;
}

#ym_header #ym_nav #gnb .header_login a {
  font-size: 12px;
  color: #666;
  margin-left: 15px;
}

#ym_header #ym_nav #gnb .header_login a i {
  font-size: 16px;
  vertical-align: text-bottom;
}

/*
#ym_header #ym_nav #gnb .header_login a.member {
    background: url(../images/icon-member.png) no-repeat left 2px;
    padding-left: 20px;
}
#ym_header #ym_nav #gnb .header_login a.member:hover {
    background: url(../images/icon-member.png) no-repeat left -23px;
}
*/
#ym_header #ym_nav #gnb .header_login a.logout {
  color: #fff;
  padding: 2px 8px;
  background: #4c72dc;
  border-radius: 50px;
}

#ym_header #ym_nav #gnb .header_login a.logout:hover {
  color: #fff !important;
  background: #3e62c2;
}

#ym_header #ym_nav #gnb .header_login a.login {
  color: #fff;
  padding: 2px 8px;
  background: #4c72dc;
  border-radius: 50px;
}

#ym_header #ym_nav #gnb .header_login a.login:hover {
  color: #fff !important;
  background: #3e62c2;
}

#ym_header #ym_nav #blind {
  position: absolute;
  left: 0;
  top: 60px;
  width: 100%;
  height: 194px;
  background: #f5f8fc;
  box-sizing: border-box;
  opacity: 1;
  -webkit-opacity: 1;
  border-top: 1px solid #dddddd;
  border-bottom: 2px solid #dddddd;
  z-index: 1;
  -webkit-box-shadow: 0 6px 0px rgb(0 0 0 / 18%);
  box-shadow: 0 6px 0px rgb(0 0 0 / 18%);
}

#ym_header #ym_nav #blind:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 50%;
  width: 214px;
  height: 194px;
  margin-left: -590px;
}

#ym_header #ym_nav #gnb {
  position: relative;
  width: 1190px;
  padding: 0 0 0 300px;
  margin: 0 auto;
  z-index: 10;
}

#ym_header #ym_nav #gnb ul {
  width: auto;
  height: auto;
}

#ym_header #ym_nav #gnb ul:after {
  content: "";
  display: block;
  clear: both;
}

#ym_header #ym_nav #gnb ul li {
  float: left;
  position: relative;
  width: 13.6%;
}

#ym_header #ym_nav #gnb ul li:first-child {
  width: 13%;
}

#ym_header #ym_nav #gnb ul li:after {
  content: "";
  display: block;
  width: 1px;
  height: 194px;
  background: rgba(255, 255, 255, 0.1);
  position: absolute;
  top: 60px;
  right: 0;
}

#ym_header #ym_nav #gnb ul li:first-child:before {
  content: "";
  display: block;
  width: 1px;
  height: 194px;
  background: rgba(255, 255, 255, 0.1);
  position: absolute;
  left: 0;
  top: 60px;
}

#ym_header #ym_nav #gnb ul li a {
  position: relative;
  display: block;
  text-decoration: none;
  font-weight: 500;
  color: #333;
  text-align: center;
  font-size: 15px;
  line-height: 60px;
  height: 60px;
  padding: 0;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
}

#ym_header #ym_nav #gnb ul li a:after {
  content: "";
  display: block;
  width: 0;
  height: 3px;
  background: #ff7415;
  position: absolute;
  left: 50%;
  bottom: -3px;
  z-index: 10;
  opacity: 0;
  -webkit-opacity: 0;
  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
}

#ym_header #ym_nav #gnb ul li a:hover,
#ym_header #ym_nav #gnb ul li a:active,
#ym_header #ym_nav #gnb ul li a.on {
  color: #ff7415 !important;
  font-weight: 600;
}

#ym_header #ym_nav #gnb ul li a:hover:after,
#ym_header #ym_nav #gnb ul li a:active:after,
#ym_header #ym_nav #gnb ul li a.on:after {
  opacity: 1;
  -webkit-opacity: 1;
  width: 100%;
  left: 0;
}

#ym_header #ym_nav #gnb ul li ul {
  position: absolute;
  top: 60px;
  height: fit-content;
  float: none;
  width: 100%;
  padding: 37px 0;
  box-sizing: border-box;
}

#ym_header #ym_nav #gnb ul li ul li {
  float: none;
  width: auto;
  text-align: left;
}

#ym_header #ym_nav #gnb ul li ul li:first-child {
  margin-top: 0;
  width: auto;
}

#ym_header #ym_nav #gnb ul li ul li:after,
#ym_header #ym_nav #gnb ul li ul li:before {
  display: none !important;
}

#ym_header #ym_nav #gnb ul li ul li a {
  font-size: 13px;
  color: #666 !important;
  font-weight: 500;
  line-height: 19px;
  height: auto;
  padding: 5px 10px;
  letter-spacing: -0.3px;
}

#ym_header #ym_nav #gnb ul li ul li a:hover {
  color: #ff7415 !important;
  font-weight: 500;
}

#ym_header #ym_nav #gnb ul li ul li a:after {
  display: none;
}

#ym_header #ym_nav #gnb ul li ul li ul {
  display: none;
}

/* .sub_menu_shift {
    position: absolute;
    top: -114px;
    left: 150px;
} */
/** ym_title **/
#ym_title {
  background: #4c72dc;
  width: 100%;
  height: 45px;
}

#ym_title .elem {
  position: relative;
  display: table;
  width: 1180px;
  height: 100%;
  margin: 0 auto;
}

#ym_title .elem h2 {
  height: 100%;
  display: table-cell;
  vertical-align: middle;
}

#ym_title .elem h2.title {
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  line-height: 34px;
  margin: 0;
  font-family: "Noto Sans KR";
}

#ym_title .elem h2.title span {
  color: #92b3fd;
  font-size: 12px;
  font-weight: 400;
  margin-left: 3px;
}

#ym_title .elem .navi {
  width: auto;
  position: absolute;
  right: 0;
  top: 15px;
  color: rgba(255, 255, 255, 0.6);
  font-weight: 400;
}

#ym_title .elem .navi span {
  display: inline-block;
  vertical-align: top;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
  font-weight: 400;
  padding: 0 8px 0 11px;
  background: url(../images/navi_arrow.svg) no-repeat left 4px;
  overflow: hidden;
}

#ym_title .elem .navi span.select {
  color: #fff !important;
}

#ym_title .elem .navi span.home {
  background: none;
  padding-left: 0;
}

#ym_title .elem .navi span.home a {
  width: 14px;
  height: 12px;
}

/** ym_search **/
.ym_search {
  background: #ffffff;
  border: 1px solid #bebec1;
}

.ym_search .ym_search_table {
  width: 100%;
  font-size: 13px;
  color: #333;
  font-weight: 400;
}

.ym_search .ym_search_table tr {
  border-top: 1px solid #ebebeb;
}

.ym_search .ym_search_table tr:first-child {
  border-top: 0px;
}

.ym_search .ym_search_table tr.disable th,
.ym_search .ym_search_table tr.disable td {
  opacity: 0.5;
  pointer-events: none;
}

.ym_search .ym_search_table th {
  padding: 4px 0;
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  min-width: 80px;
}

.ym_search .ym_search_table td {
  padding: 4px 0;
}

.ym_search div {
  display: inline-block;
}

.div_select {
  display: inline-block;
  color: #333;
  line-height: 24px;
  margin-left: 5px;
  background: #fff;
  border: 1px solid #bdbcbc;
  padding: 0px 8px 1px;
  box-sizing: border-box;
  border-radius: 15px;
  margin-top: 2px;
  margin-bottom: 2px;
}

.div_select i {
  color: #666;
}

.div_select:hover i {
  color: #4c72dc;
}

.div_select span {
  display: inline-block;
  vertical-align: top;
  font-weight: 400;
  padding: 0 3px 0 10px;
  background: url(../images/navi_arrow_black.svg) no-repeat left 9px;
  overflow: hidden;
}

.div_select span.none {
  padding: 0 3px 0 0;
  background: transparent;
}

span.description {
  font-size: 10px;
  color: #777;
  display: none;
}

.div_select span.del {
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url(../images/icon_re_del.svg) no-repeat center;
  cursor: pointer;
  vertical-align: text-bottom;
}

.div_select:hover {
  color: #2247b0;
  background: #fff;
  border: 1px solid #617fd3;
}

.div_select:hover span {
  background: url(../images/navi_arrow_black_over.svg) no-repeat left 9px;
}

.div_select:hover span.none {
  padding: 0 3px 0 0;
  background: transparent;
}

.div_select:hover span.del {
  background: url(../images/icon_re_del_over.svg) no-repeat center;
}

.btn_add_rec {
  padding: 0;
  border: 0;
  background: transparent;
  margin: 0 4px;
}

.ym_search .ym_search_table td.search_bottom {
  background: #fafafa;
  padding: 6px 20px;
}

/** ym_tab **/
.ym_tab-div {
  margin-top: 28px;
  margin-bottom: 2px;
  height: 25px;
}

.ym_tab {
  float: left;
  margin-top: 7px;
}

.ym_tab li {
  float: left;
  padding: 2px 15px 0 0;
  line-height: 20px;
  cursor: pointer;
}

.ym_tab li a {
  position: relative;
  padding: 7px 1px 0;
}

.ym_tab li a.on {
  color: #4c72dc;
  font-weight: 500;
}

.ym_tab li a.on:after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background: #4c72dc;
  position: absolute;
  top: 1px;
  left: 0;
}

.ym_box_blue {
  padding: 10px;
  text-align: center;
  background: #f1f8ff;
  border: 1px solid #d1ddef;
  box-sizing: border-box;
  margin-top: 15px;
}

/** ym_visual **/
.ym_visual {
  width: 100%;
  height: 150px;
  font-weight: 500;
  text-align: center;
  background: #edf5ff url(../images/visual_img.png) no-repeat center;
  border-bottom: 1px solid #dae4f0;
  padding: 25px 0;
  letter-spacing: -0.5px;
}

.ym_visual .ym_layout h3 {
  font-size: 24px;
  font-weight: 600;
  line-height: 35px;
  color: #3e5081;
  margin-bottom: 3px;
}

.ym_visual .ym_layout p {
  font-size: 14px;
  line-height: 16px;
  color: #6f9ae3;
}

/** ym_visual **/
.ym_visual02 {
  width: 100%;
  height: 300px;
  font-weight: 500;
  text-align: center;
  background: #edf5ff url(../images/visual_img.png) no-repeat center;
  border-bottom: 1px solid #dae4f0;
  padding: 25px 0;
  letter-spacing: -0.5px;
}

.ym_visual02 .ym_layout h3 {
  font-size: 24px;
  font-weight: 600;
  line-height: 35px;
  color: #3e5081;
  margin-bottom: 3px;
}

.ym_visual02 .ym_layout p {
  font-size: 14px;
  line-height: 16px;
  color: #6f9ae3;
}

/** main **/
.ym_main {
  height: calc(100vh - 360px - 60px);
  min-height: 870px;
  text-align: center;
  background: #e0e9f8 url(../images/bg_main.png) no-repeat center;
  display: flex;
  align-items: center;
}

.ym_main h1 {
  font-family: Roboto;
  font-size: 70px;
  font-weight: bold;
  color: #192950;
  line-height: 80px;
  margin-top: 50px;
}

.ym_main h1 span {
  font-weight: 300;
  font-size: 65px;
}

.ym_main .main_stitle {
  font-size: 16px;
  color: #666;
  font-weight: 400;
  letter-spacing: -0.3px;
  margin-top: 10px;
  line-height: 26px;
}

.ym_main .main_card {
  margin-top: 80px;
  margin-bottom: 50px;
  display: flex;
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.ym_main .main_card .card_banner {
  position: relative;
  width: 260px;
  height: 300px;
  padding: 45px 20px;
  background: #ffffff;
  border: 1px solid #fff;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.15);
  border-radius: 5px;
}

.ym_main .main_card .card_banner:hover {
  cursor: pointer;
  border: 1px solid #122455;
}

.ym_main .main_card .card_banner img {
  position: absolute;
  bottom: 40px;
  left: 27%;
}

.ym_main .main_card .card_banner h2 {
  font-size: 24px;
  color: #122455;
  font-weight: 600;
}

.ym_main .main_card .card_banner h2 span {
  font-size: 16px;
  color: #5f6173;
  font-weight: 400;
}

/** footer 위치 **/
.ym_body_short {
  min-height: calc(100vh - 60px - 360px);
}

.ym_body_long {
  min-height: calc(100vh - 60px - 95px);
}

/** notice **/
.notice th.stitle {
  color: #666;
  font-weight: 400;
}

/** notice **/
.table-notice th,
.table-notice td {
  padding: 12px;
}

.table-notice th b {
  padding: 0 12px;
  font-weight: 600;
  line-height: 16px;
}

.table-notice td {
  position: relative;
}

.table-notice td a {
  cursor: pointer;
}

.table-notice td.cont {
  padding: 25px 25px 35px 25px;
}

.table-notice td.line {
  text-align: left;
  color: #000;
  padding-left: 20px;
}

.table-notice td.line:after {
  content: "";
  display: block;
  width: 1px;
  height: 12px;
  background: #ddd;
  position: absolute;
  top: 13px;
  left: 0px;
}

/** faq **/
.ym-table-faq {
  width: 100%;
  height: auto;
  border-collapse: collapse;
  padding: 0;
  margin: 0;
  border-top: 1px solid #666;
}

.ym-table-faq {
  font-size: 13px;
}

.ym-table-faq label {
  font-size: 13px;
}

.ym-table-faq th {
  color: #000;
  font-size: 13px;
  font-weight: 400;
  text-align: left;
  min-height: 36px;
  line-height: 19px;
  padding: 11px 10px 11px;
  background: #fff;
  border-left: 0px solid #dadce0;
  border-bottom: 1px solid #dadce0;
}

.ym-table-faq th b {
  font-size: 14px;
  font-weight: 500;
}

.ym-table-faq tr th:first-child {
  border-left: 0;
}

.ym-table-faq td {
  font-weight: 400;
  text-align: left;
  color: #555;
  min-height: 34px;
  line-height: 20px;
  padding: 11px 10px 11px;
  background: #fff;
  border-left: 0px solid #dadce0;
  border-bottom: 1px solid #dadce0;
}

.ym-table-faq td b {
  font-weight: 500;
  margin-right: 10px;
}

.ym-table-faq td.faq {
  color: #333;
  background: #fafafa;
}

.ym-table-faq td a:hover {
  color: #333 !important;
}

.ym-table-faq td.over {
  background: #fff;
}

.ym-table-faq td.over a {
  font-weight: 500;
  color: #1e56b6 !important;
  font-size: 13px;
}

.ym-table-faq td.over span {
  font-weight: 500;
  color: #1e56b6 !important;
  font-size: 13px;
}

.ym-table-faq td:first-child {
  border-left: 0;
}

.ym-table-faq div.faq_q {
  position: relative;
  padding: 0 0 0 31px;
  line-height: 20px;
  font-size: 13px;
}

.ym-table-faq div.faq_a {
  position: relative;
  padding: 0 0 0 31px;
  line-height: 20px;
  font-size: 13px;
  text-align: left;
}

.icon_q {
  position: absolute;
  top: 2px;
  left: 2px;
  display: inline-block;
  width: 20px;
  height: 20px;
  line-height: 10px;
  font-family: Roboto;
  font-size: 12px;
  color: #fff;
  text-align: center;
  background: #666666;
  padding: 5px;
  border-radius: 50%;
  margin-right: 7px;
}

.ym-table-faq td.over .icon_q {
  background: #1e56b6;
  color: #fff !important;
}

.icon_a {
  position: absolute;
  top: 3px;
  left: 2px;
  display: inline-block;
  width: 20px;
  height: 20px;
  line-height: 10px;
  font-family: Roboto;
  font-size: 13px;
  color: #fff;
  text-align: center;
  background: #599fff;
  padding: 5px;
  border-radius: 50%;
  margin-right: 7px;
}

.icon_ripple {
  position: relative;
  display: inline-block;
  line-height: 10px;
  font-size: 13px;
  color: #fff;
  text-align: center;
  background: #4c72dc;
  padding: 6px 10px;
  margin-top: 8px;
  margin-bottom: 12px;
  border-radius: 1px;
}

.icon_ripple:after {
  content: "";
  display: block;
  position: absolute;
  right: 0;
  top: -11px;
  left: -16px;
  width: 15px;
  height: 28px;
  background: url(../images/icon_replay_arrow.png) no-repeat left;
}

.ym-table-faq b.comments_count {
  font-weight: 400;
  line-height: 25px;
}

.ym-table-faq b.comments_count .count_num {
  font-weight: 600;
  margin: 0 1px 0 3px;
  color: #000;
}

.ym-table-faq .comments_box {
  position: relative;
}

.ym-table-faq .comments_box .comment_title {
  color: #333;
  margin-top: 0;
  height: 25px;
  line-height: 25px;
}

.ym-table-faq .comments_box .comment_title button {
  vertical-align: top;
  /*margin-left: 5px;*/
}

.ym-table-faq .comments_box .comment_title span.comm_date {
  position: relative;
  color: #888888;
  margin-left: 20px;
}

.ym-table-faq .comments_box .comment_title span.comm_date:after {
  content: "";
  display: block;
  position: absolute;
  right: 0;
  top: 4px;
  left: -12px;
  width: 1px;
  height: 12px;
  background: #c5c2c2;
}

.ym-table-faq .comments_box .comm_btn {
  position: absolute;
  top: -3px;
  right: 2px;
  margin: 0;
}

.ym-table-faq .comments_box div {
  margin: 15px 0 10px;
}

/* win_popup */
.ym_popup_header {
  position: relative;
  top: 0;
  bottom: 0;
  left: 0px;
  right: -0.5px;
  margin: 0;
  height: 44px;
  font-weight: 500;
  font-size: 14px;
  color: #000;
  text-align: center;
  line-height: 26px;
  background: #fafafa;
  border-bottom: 1px solid #dadce0;
  padding: 7px;
  box-shadow: 0px 0px 4px rgba(33, 33, 36, 0.26);
  z-index: 999;
  cursor: move;
}

.close_btn {
  display: block;
  width: 45px;
  height: 38px;
  background: url(../images/layer_close_ico.png) no-repeat center 50%;
  position: absolute;
  right: 0;
  top: 3px;
  z-index: 101;
  overflow: hidden;
  text-indent: -9999px;
}

.ym_popup {
  position: relative;
  height: 100%;
  /*background: #fafafa;*/
  overflow: hidden;
}

.ym_popup .popup_cont {
  width: 100%;
  height: calc(100% - 40px);
  min-height: 450px;
  padding: 20px 20px 15px;
  overflow: auto;
}

.ym_popup .popup_cont .popup_left {
  float: left;
  width: 24%;
  margin-bottom: 15px;
}

.ym_popup .popup_cont .popup_right {
  float: right;
  width: 74%;
}

.ym_popup .popup_cont .pop_title {
  color: #333;
  font-weight: 600;
  margin-bottom: 10px;
  float: left;
}

.ym_popup .popup_cont .pop_title_left {
  color: #333;
  font-weight: 600;
  margin-top: 5px;
  margin-bottom: 5px;
  float: left;
}

.ym_popup .popup_cont .pop_buttom_group {
  float: right;
  position: relative;
}

.ym_popup .popup_cont .pop_tree {
  color: #333;
  line-height: 24px;
  background: #fdfdfd;
  border: 1px solid #dadce0;
  padding: 10px;
  height: 450px;
  border-radius: 2px;
  box-sizing: border-box;
}

.ym_popup .popup_cont .pop_tree i {
  color: #666;
}

.ym_popup .popup_cont .pop_tree li a:hover > i,
.ym_popup .popup_cont .pop_tree li a.on > i,
.ym_popup .popup_cont .pop_tree li.on > i,
.ym_popup .popup_cont .pop_tree li a.on {
  color: #4c72dc;
}

.pop_select {
  position: relative;
  margin-bottom: 25px;
  overflow: auto;
  background: #fdfdfd;
  border: 1px solid #dadce0;
  padding: 5px;
  border-radius: 2px;
}

.pop_select .div_select {
  margin-right: 5px;
  margin-left: 0px;
}

.ym_popup .popup_cont .pop_bottom_search {
  font-size: 12px;
  color: #333;
  font-weight: 500;
  padding: 10px 15px;
  margin: 10px -10px -10px;
  border-top: 1px dashed #dadce0;
  background: #fafafa;
}

.ym_popup .popup_cont .pop_bottom_search input,
.ym_popup .popup_cont .pop_bottom_search select {
  background: #fff;
  font-size: 12px;
}

.ym_popup .popup_cont .pop_bottom_search span {
  margin-right: 5px;
}

.ym_popup .popup_cont .pop_bottom_search input,
select {
  margin-right: 5px;
}

.ym_popup .popup_cont .pop_bottom {
  text-align: center;
  margin-bottom: 15px;
  clear: both;
}

.ym_popup_bottom {
  position: relative;
  height: 100%;
  /*background: #fafafa;*/
  overflow: hidden;
}

.ym_popup_bottom .popup_cont {
  width: 100%;
  padding: 20px 20px 15px;
  overflow: auto;
}

.ym_popup_bottom .popup_cont .pop_bottom {
  text-align: center;
  margin-bottom: 15px;
  clear: both;
}

.pop_tree {
  margin-top: 10px;
  padding-right: 20px;
  height: calc(100% - 85px);
  overflow: overlay;
}

.pop_tree ul li {
  position: relative;
  overflow: hidden;
}

.pop_tree ul li.on {
  background: #e5f3ff;
}

.pop_tree ul li.on a {
  color: #1e56b6;
}

.pop_tree ul li a {
  float: left;
  font-size: 12px;
  padding-left: 14px;
  line-height: 22px;
  /*width: calc(100% - 40px);*/
  width: 100%;
  cursor: pointer;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.pop_tree ul li.f_close > a {
  background: url(../images/icon-arrow-open.svg) no-repeat left 3px;
}

.pop_tree ul li.f_close > a.on {
  background: url(../images/icon-arrow-open.svg) no-repeat left 3px, #f8f8fb;
}

.pop_tree ul li.f_open > a {
  background: url(../images/icon-arrow.svg) no-repeat left 3px;
}

.pop_tree ul li.f_open > a.on {
  background: url(../images/icon-arrow.svg) no-repeat left 3px, #f8f8fb;
}

.pop_tree ul li > a.on {
  background: #f8f8fb;
}

.pop_tree ul li.step-02 a {
  margin-left: 20px;
  width: calc(100% - 60px);
}

.pop_tree ul li.step-03 a {
  margin-left: 40px;
  width: calc(100% - 80px);
}

.pop_tree ul li img {
  margin-right: 5px;
}

/** platform_copyright_main **/
#ym_copyright_main {
  position: relative;
  font-size: 12px;
  color: #777;
  background: #fff;
  /*border-top : 1px solid #ebebeb;background:#fafafa;margin-top:20px;*/
  padding: 0 10px 0;
  overflow: hidden;
}

#ym_copyright_main .ym_copyright_cont {
  position: relative;
  height: auto;
  background: #fff;
  margin: 0 auto;
  padding: 0;
  /*border-top : 1px solid #ebebeb;*/
  overflow: hidden;
}

#ym_copyright_main .ym_copyright_cont .ym_layout {
  position: relative;
}

#ym_copyright_main .copy_left {
  /*font-family: Roboto;*/
  font-size: 15px;
  float: left;
  font-weight: 500;
  color: #000;
  line-height: 29px;
  letter-spacing: -0.5px;
  padding-left: 31px;
  background: url(../images/logo-header.svg) no-repeat left 0px;
  opacity: 0.65;
}

#ym_copyright_main .copy_left b {
  font-size: 19px;
  font-weight: 900;
  color: #122455;
}

#ym_copyright_main .copy_right {
  float: right;
}

#ym_copyright_main .copy_right ul li {
  position: relative;
  float: left;
  padding: 0 0 0 30px;
}

#ym_copyright_main .copy_right ul li:after {
  content: "";
  display: block;
  width: 1px;
  height: 12px;
  background: #ddd;
  position: absolute;
  top: 0;
  left: 15px;
}

#ym_copyright_main .copy_right ul li:first-child:after {
  width: 0px;
  background: #fff;
}

#ym_copyright_main .copy_banner {
  margin: 0 auto;
  padding: 10px 0;
  background: #fafafa;
}

#ym_copyright_main .copy_banner ul li {
  float: left;
  width: 20%;
}

#ym_copyright_main .copy_banner ul li a {
  display: block;
  border: 1px solid #ebebeb;
  width: 218px;
  box-sizing: border-box;
  padding: 0;
}

#ym_copyright_main .copy_banner ul li a img {
  width: 216px;
  height: 48px;
}

#ym_copyright_main .copy_banner ul li a:hover {
  border: 1px solid #bebec1;
}

#ym_copyright_main .copy_link {
  margin: 0 auto;
  padding: 0 200px 0 300px;
}

#ym_copyright_main .copy_link ul {
  display: inline-block;
  float: left;
  width: 25%;
  min-height: 120px;
  margin-bottom: 25px;
}

#ym_copyright_main .copy_link ul li {
  line-height: 22px;
  font-size: 13px;
}

#ym_copyright_main .copy_link ul li b {
  display: inline-block;
  font-weight: 600;
  font-size: 14px;
  color: #555;
  margin-bottom: 5px;
}

#ym_copyright_main p {
  position: relative;
  width: 1190px;
  text-align: center;
  line-height: 20px;
  margin: 20px auto 10px;
  clear: both;
  z-index: 10;
}

#ym_copyright_main.fixed_footer {
  position: absolute;
  bottom: 0;
  display: inline-block;
  width: 100%;
}

/** platform_copyright_sub **/
#ym_copyright_sub {
  font-size: 12px;
  color: #777;
  /*background:#F3F5F7;*/
  border-top: 1px solid #dadce0;
  margin-top: 20px;
  padding: 15px 10px;
}

#ym_copyright_sub p {
  position: relative;
  width: 1190px;
  text-align: center;
  margin: 0 auto;
  z-index: 10;
}

/** error_page **/
.error_page {
  width: 100%;
  height: 100%;
  padding: 50px;
  text-align: center;
}

.error_page > h1 {
  font-size: 42px;
  color: #1e56b6;
  line-height: 38px;
  margin-bottom: 40px;
}

.error_page > h1 span {
  font-size: 14px;
}

.error_page > .error_cont {
  margin: 0 auto;
  text-align: center;
  font-size: 14px;
  color: #666;
  font-weight: 400;
  line-height: 22px;
}

.error_page > .error_cont table {
  margin: 0 auto;
}

.error_page > table th,
td {
  text-align: left;
  padding: 3px 20px;
}

.error_page > table th {
  color: #000;
}

.error_page > table th {
  color: #666;
}

/*
* End : layout
*/

/**********************************************************/
/**
 * begin: pagination 
 **/
.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
  /* z-index: 3;
    color: #fff;
    background-color: #3396ff;
    border-color: #3396ff; */
  color: #000;
  background-color: #fff !important;
  border: 1px solid #666 !important;
  /* width: 26px;
    height: 26px;
    line-height: 24px; */
  font-weight: normal;
}

.pagination > .disabled > a,
.pagination > .disabled > a:focus,
.pagination > .disabled > a:hover,
.pagination > .disabled > span,
.pagination > .disabled > span:focus,
.pagination > .disabled > span:hover {
  color: #9a9c9e;
  cursor: not-allowed;
  background-color: transparent;
  /* border-color: #363636;
    border-radius: 0;
    margin-right: 2.5px; */
}

.pagination > li > a:focus,
.pagination > li > span:focus {
  z-index: 2;
  color: #1e56b6 !important;
  border: 0px solid #000;
  /* margin-right: 2.5px; */
}

.pagination > li > a:hover,
.pagination > li > span:hover {
  z-index: 2;
  color: #1e56b6 !important;
  border: 0px solid #000;
  background-color: #fff;
  /* border-color: #363636; */
  margin-right: 2.5px;
}

/* prev, next */
.pagination > .pagination-prev > a {
  background: url("../images/paginate_prev.gif") 0 -1px;
  color: transparent !important;
  margin-right: 6.5px !important;
}

.pagination > .pagination-next > a {
  background: url("../images/paginate_next.gif") 0 -1px;
  color: transparent !important;
  margin-left: 6.5px !important;
}

.pagination > .pagination-prev > a:hover {
  background: url("../images/paginate_prev.gif");
  background-color: transparent !important;
  color: transparent !important;
}

.pagination > .pagination-next > a:hover {
  background: url("../images/paginate_next.gif");
  background-color: transparent !important;
  color: transparent !important;
}

/* first, last */
.pagination > li:first-child > a {
  background: url("../images/paginate_first.gif") 0 -1px;
  color: transparent !important;
  border-radius: 0px !important;
}

.pagination > li:last-child > a {
  background: url("../images/paginate_last.gif") 0 -1px;
  color: transparent !important;
  border-radius: 0px !important;
}

.pagination > li > a,
.pagination > li > span {
  position: relative;
  float: left;
  color: #666;
  text-decoration: none;
  background-color: transparent;
  border: 0px solid #ccc;
  width: 26px;
  height: 26px;
  line-height: 24px;
  padding: 0 !important;
  margin-right: 2.5px;
}

/**
* End : pagenation
**/
/*****************************************************/

.no-drag {
  -ms-user-select: none;
  -moz-user-select: -moz-none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  user-select: none;
}

.text-drag {
  -ms-user-select: text;
  -moz-user-select: text;
  -webkit-user-select: text;
  -khtml-user-select: text;
  user-select: text;
}

.text-draggable,
.no-drag .text-draggable {
  -ms-user-select: text;
  -moz-user-select: -moz-text;
  -webkit-user-select: text;
  -khtml-user-select: text;
  user-select: text;
}

.cursor_pt {
  cursor: pointer;
}

.modal-dialog {
  -ms-user-select: none;
  -moz-user-select: -moz-none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  user-select: none;
}

/*****************************************************/

/**
 * 권한 맵핑 다이얼로그 
 **/

.grade_mapping_left {
  float: left;
  width: 44%;
  margin-bottom: 15px;
  padding: 12px;
}

.grade_mapping_center {
  float: left;
  width: 6%;
  margin-bottom: 15px;
  padding: 12px;
  min-height: 150px;
}

.grade_mapping_right {
  float: left;
  width: 47%;
  margin-bottom: 15px;
  padding: 12px;
}

.grade_mapping_left .pop_title {
  color: #333;
  font-weight: 600;
  margin-bottom: 10px;
}

.grade_mapping_left .pop_tree {
  background: #fdfdfd;
  border: 1px solid #dadce0;
  padding: 10px;
  height: 450px;
  border-radius: 2px;
  box-sizing: border-box;
}

.grade_mapping_left .pop_tree li {
  position: relative;
  margin-bottom: 1px;
  overflow: hidden;
}

.arrow_icon {
  background: url(../images/icon_arrow.svg) no-repeat left 3px;
}

.grade_mapping_center {
  float: left;
  width: 12%;
  height: 100%;
  text-align: center;
  padding-top: 220px;
}

.btn_arrow {
  display: inline-block;
  vertical-align: middle;
  line-height: 28px;
  font-size: 14px;
  font-weight: 300;
  text-decoration: none !important;
  border-radius: 1px;
  letter-spacing: 0.5px;

  background: transparent;
  color: rgb(255, 255, 255, 0.6);
  /* border: 1px solid rgb(255, 255, 255, 0.2) !important; */
}

.btn_arrow:hover {
  color: rgb(50, 150, 255, 0.9);
  border: 1px solid rgb(50, 150, 255, 0.6) !important;
}

.pop_tree li:hover i {
  color: #1e56b6;
}

.pop_tree li.selected > a,
.pop_tree li.selected i {
  color: #1e56b6;
}

.pop_tree li a span {
  padding: 2px 4px;
}

.pop_tree li a i {
  color: #888;
}

.pop_tree li.selected a {
  background: #e5f3ff url(../images/icon-arrow-open.svg) no-repeat left 3px !important;
}

.pop_tree li.disabled a {
  color: #444;
}

.pop_tree li.disabled a {
  background: #e9e9e9 url(../images/icon-arrow-open.svg) no-repeat left 3px !important;
}

/****************************************************/

/**
 * 관리페이지 메뉴 CSS: s 
 **/
.position-right {
  position: absolute;
  right: 0;
  top: 0;
}

/**
 * 관리페이지 메뉴 CSS: e
 **/

/**
 * 페이지 관리 메뉴 CSS :s
 **/

.menu-grid {
  min-height: 200px;
  border: 1px solid #ddd;
  padding: 10px 30px;
  background: #fdfdfd;
  position: relative;
}

.menu-grid-cont {
  display: inline-flex;
  width: calc(1080px / 4);
  flex-direction: column;
  /*margin: 10px 6px;*/
  padding: 0 40px;
  margin: 0 auto;
  text-align: center;
}

.menu-grid-cont .level::before {
  content: "";
  height: calc(100% - 30px);
  border-left: 1px solid #c7c7c7;
  position: absolute;
  top: 0;
}

.menu-grid-cont .level {
  position: relative;
  margin-left: 25px;
  top: 0;
  float: left;
}

.menu-grid-cont .item::before {
  content: "";
  width: 20px;
  border-top: 1px solid #c7c7c7;
  position: absolute;
  margin-top: 40px;
  left: 0;
}

.menu-grid-cont .item {
  display: inline-block;
  position: relative;
}

.menu-grid-cont .item:last-child::after {
  background-color: white;
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  width: 2px;
  top: 41px;
}

.menu-category {
  float: left;
  display: inline-block;
  text-align: center;
  border: 1px solid #becfe8;
  height: 36px;
  max-height: 50px;
  overflow: hidden;
  /*box-shadow: 3px 3px 0px #f0f0f0;
    -webkit-box-shadow: 3px 3px 0px #f0f0f0;*/
  width: calc(910px / 4);
  margin: 10px 0px 0px 10px;
  position: relative;
  cursor: pointer;
}

.menu-category:hover {
  /*border: 1px solid #2188ff;*/
  border: 1px solid #7997c7;
  box-shadow: 3px 3px 0px #e2e8f3;
  -webkit-box-shadow: 3px 3px 0px #e2e8f3;
}

.menu-category.no-hover:hover {
  border: 1px solid silver !important;
}

.menu-category.disabled {
  color: #bebcbc;
  border: 1px solid #bebcbc;
  cursor: not-allowed;
}

.menu-category.selected {
  border: solid 1px #2188ff;
  color: #2188ff;
  font-weight: 600;
}

.menu-category .name {
  height: 100%;
  font-size: 14px;
  color: #3e5081;
  font-weight: 600;
  text-align: center;
  vertical-align: middle;
  background: #eef5ff;
  padding: 4px;
  line-height: 25px;
}

/*
.menu-category .name:hover {
    color: #2188ff;
}
*/

.menu-category .name.no-hover:hover {
  color: #666666;
}

.menu-category.disabled .name.no-hover:hover {
  color: #bebcbc;
}

.menu-category .description {
  padding: 4px;
  height: 50%;
}

.menu-category .btn-div {
  position: absolute;
  top: 2px;
  right: 1px;
}

.menu-category .btn-div .ym-btn {
  margin: 0;
  font-size: 12px;
  padding: 0px;
  min-width: 19px;
  min-height: 19px;
  line-height: 15px;
}

.menu-category .btn-div .tight {
  right: -7px;
}

.menu-div {
  position: relative;
  float: left;
  display: inline-block;
  text-align: center;
  border: 1px solid silver;
  /*height: 72px;*/
  /*max-height: 60px;*/
  overflow: hidden;
  /*box-shadow: 3px 3px 0px #f2f3f6;
    -webkit-box-shadow: 3px 3px 0px #f2f3f6;*/
  width: calc(770px / 4);
  margin: 10px 0px 0px 19px;
  cursor: pointer;
}

.menu-div:hover {
  border: 1px solid #666;
  box-shadow: 3px 3px 0px #ebecf1;
  -webkit-box-shadow: 3px 3px 0px #ebecf1;
}

.menu-div.no-hover:hover {
  border: 1px solid silver !important;
}

.menu-div.disabled {
  color: #bebcbc;
  border: 1px solid #bebcbc;
  cursor: not-allowed;
}

.menu-div.selected {
  border: solid 1px #2188ff;
  color: #2188ff;
  font-weight: 600;
}

.menu-div .name-div {
  font-size: 12px;
  line-height: 18px;
  font-weight: 500;
  padding: 4px;
  color: #333;
  text-align: center;
  vertical-align: middle;
  background-color: #f7f7f7;
}

.menu-div .name-div .name:hover {
  /*color: #2188ff;*/
}

.menu-div .name-div .name.no-hover:hover {
  color: #666666 !important;
}

.menu-div.disabled .name-div .name.no-hover:hover {
  color: #bebcbc !important;
}

.menu-div .name span.name-rock {
  position: absolute;
  top: 3px;
  left: 7px;
  font-size: 6px !important;
  color: #888;
}

.menu-div .name span.name-button {
  position: absolute;
  top: 3px;
  right: 5px;
  font-size: 14px !important;
  color: #777;
}

.menu-div .name span.name-button i {
  margin-left: 1px;
}

.menu-div .name span i:hover {
  color: #000;
}

.menu-div .name span.name-button i.cancel {
  color: rgb(212, 95, 95);
}

.menu-div .name span.name-button i:hover.cancel {
  color: red;
}

.menu-div .name span.name-button .fa-caret-square-up,
.menu-div .name span.name-button .fa-caret-square-down {
  color: rgb(212, 95, 95);
}

.menu-div .name span.name-button .fa-caret-square-up:hover,
.menu-div .name span.name-button .fa-caret-square-down:hover {
  color: red;
}

.menu-div .url {
  color: #777;
  font-size: 8px !important;
  font-weight: 400;
  line-height: 13px;
  margin-bottom: 2px;
}

.menu-div .description {
  padding: 4px;
  height: 30px;
  font-size: 11px;
  line-height: 20px;
  /*background: #edf5ff;*/
  background: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dark_blue {
  color: #122455;
}

/**
 * 페이지 관리 메뉴 CSS :e
 **/

/**
 * BEGIN: Loading
 */

.each_masking_loading {
  z-index: 10000;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background: #ffffff91;
}

.each_masking_loading .msgDiv {
  font-size: 40px;
  text-align: center;
  position: relative;
  top: 45%;
  color: #888;
}

.each_masking_loading .msgDiv i {
  font-size: 40px;
}

/* ngIf animation */
.animationIf.ng-enter,
.animationIf.ng-leave {
  -webkit-transition: opacity ease-in-out 0.5s;
  -moz-transition: opacity ease-in-out 0.5s;
  -ms-transition: opacity ease-in-out 0.5s;
  -o-transition: opacity ease-in-out 0.5s;
  transition: opacity ease-in-out 0.5s;
}

.animationIf.ng-enter,
.animationIf.ng-leave.ng-leave-active {
  opacity: 0;
}

.animationIf.ng-leave,
.animationIf.ng-enter.ng-enter-active {
  opacity: 1;
}

/**
 * E N D: Loading
 */

/**
 * BEGIN: Icons
 */

/** circle-plus button*/
.icon_btn_add_rec {
  content: url(/static/images/btn_add_rec.svg);
}

/** circle-reload button*/
.icon_btn_reload {
  content: url(/static/images/icon_btn_reload.svg);
}

/** 페이지네이션 시작 아이콘*/
.paginate_first {
  content: url(/static/images/paginate_first.gif);
}

/** 페이지네이션 이전 아이콘*/
.paginate_prev {
  content: url(/static/images/paginate_prev.gif);
}

/** 페이지네이션 다음 아이콘*/
.paginate_next {
  content: url(/static/images/paginate_next.gif);
}

/** 페이지네이션 마지막 아이콘*/
.paginate_last {
  content: url(/static/images/paginate_last.gif);
}

/** 우측방향 화살표 아이콘*/
.navi_arrow_black {
  content: url(/static/images/navi_arrow_black.svg);
}

/** 다운로드 아이콘*/
.icon_download {
  content: url(/static/images/icon_download.svg);
}

/** 에러 아이콘*/
.icon_error {
  content: url(/static/images/icon_error.png);
}

/** 뒤로가기 화살표 아이콘*/
.icon_arrow_back {
  content: url(/static/images/icon_arrow_back.png);
}

/** 로그인페이지 로고 아이콘*/
.logo-login {
  content: url(/static/images/logo-login.svg);
}

/** 회원가입 페이지 로고 아이콘*/
.logo-header {
  content: url(/static/images/logo-header.svg);
}

/**
 * E N D: Icons
 */

/**
 * BEGIN: width 
 */
.wd_5 {
  width: 5%;
}

.wd_10 {
  width: 10%;
}

.wd_15 {
  width: 15%;
}

.wd_20 {
  width: 20%;
}

.wd_25 {
  width: 25%;
}

.wd_30 {
  width: 30%;
}

.wd_35 {
  width: 35%;
}

.wd_40 {
  width: 40%;
}

.wd_45 {
  width: 45%;
}

.wd_50 {
  width: 50%;
}

.wd_55 {
  width: 55%;
}

.wd_60 {
  width: 60%;
}

.wd_65 {
  width: 65%;
}

.wd_70 {
  width: 70%;
}

.wd_75 {
  width: 75%;
}

.wd_80 {
  width: 80%;
}

.wd_85 {
  width: 85%;
}

.wd_90 {
  width: 90%;
}

.wd_95 {
  width: 95%;
}

.wd_100 {
  width: 100%;
}

/**
 * 관리테이블 문자열 .. 처리 css
 */
tr.inline-block-tr th,
tr.inline-block-tr td {
  display: inline-block;
}

tr.word_sign-tr th,
tr.word_sign-tr td {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 7px 2px;
}

/**
 * 다이얼로그 필수 표시 아이콘 css
 */
.asterisk {
  color: red;
  font-size: 10px;
}

/**
 * 테이블 Loading Masking을 위한 class
 */
.ym-table-div {
  width: 100%;
  height: 100%;
  position: relative;
}

/**
 *  필수 입력 메시지 css
 */
.info_need {
  padding: 4px;
  font-size: 11px;
}

.info_need span span {
  color: red;
}

/* word가 길어질 경우 줄이는 클래스 */
.word_sign {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ws_width {
  display: inline-block;
  width: 100%;
}

.ym-table-div .ym-table-list thead th span {
  /* display: block; */
}

/**
 * E N D: width 
 */

/**
 * CSS 오류 수정
 */

.modal-content {
  width: calc(100% - 1px);
  border-radius: 0;
}

/**
 * toastr 가독성 향상을 위한 css 수정 
 */

#toast-container.toast-top-center .toast,
#toast-container.toast-bottom-center .toast {
  width: 400px;
  line-height: 20px;
}

#toast-container .toast {
  margin-top: 10px;
  padding: 15px 20px 20px 75px;
  opacity: 1;
}

.toast-title {
  line-height: 30px;
  font-weight: normal;
  font-size: 14px;
}

span.empty-div {
  text-align: center;
  width: 100%;
  color: silver;
  display: inline-block;
  height: 15px;
  position: relative;
  top: 45%;
}

span.empty-search-option {
  color: silver;
  font-size: 12px;
  font-weight: bold;
  margin: 0 5px;
  line-height: 32px;
}

@-webkit-keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
  }
}

@-moz-keyframes spin {
  100% {
    -moz-transform: rotate(360deg);
  }
}

@-ms-keyframes spin {
  100% {
    -ms-transform: rotate(360deg);
  }
}

@keyframes spin {
  100% {
    transform: rotate(360deg);
  }
}

i.fa-spin-hover:hover,
.spin-hover:hover i {
  -webkit-animation: spin 2s infinite linear;
  -moz-animation: spin 2s infinite linear;
  -o-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
}

/**
 * tabs css 수정 
 */
.nav-tabs {
  margin: 5px 10px;
  border-bottom: 1px solid #9a9c9e;
}

.nav-tabs > li > a {
  color: #666;
  font-size: 12px;
  font-weight: 500;
  padding: 7px 15px;
  border-left: 1px solid #ddd;
  border-top: 1px solid #ddd;
  border-right: 1px solid #ddd;
}

.nav-tabs > li > a:hover {
  background: transparent;
  border-left: 1px solid #ddd;
  border-top: 1px solid #ddd;
  border-right: 1px solid #ddd;
  border-bottom: transparent;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
  color: #333;
  border-left: 1px solid #888;
  border-top: 1px solid #888;
  border-right: 1px solid #888;
  background-color: #fff;
}

.ym-btn i {
  position: relative;
  top: -1px;
  margin-right: 3px;
  font-size: 10px;
}

.ym-btn.icon-button i {
  margin: 0;
}

.toast {
  background-color: #fafafa;
}

.toast-info {
  background-color: #fafafa;
}

.toast-error {
  background-color: #fafafa;
}

.toast-success {
  background-color: #fafafa;
}

.toast-warning {
  background-color: #fafafa;
}

#toast-container .toast.toast-info {
  background-image: url("../images/icon_toast_info.png") !important;
}

#toast-container .toast.toast-error {
  background-image: url("../images/icon_toast_error.png") !important;
}

#toast-container .toast.toast-success {
  background-image: url("../images/icon_toast_success.png") !important;
}

#toast-container .toast.toast-warning {
  background-image: url("../images/icon_toast_warning.png") !important;
}

#toast-container .toast.toast-info .toast-title {
  color: #3295bb;
}

#toast-container .toast.toast-error .toast-title {
  color: #f05940;
}

#toast-container .toast.toast-success .toast-title {
  color: #8cc73f;
}

#toast-container .toast.toast-warning .toast-title {
  color: #ffca06;
}

.toast-message {
  color: #58635f;
}

.toast-close-button {
  color: #58635f;
}

.search-duration {
  color: #999999;
  font-size: 10px;
}

.tr-hover:hover td {
  background: #f8f8fb;
}

/**
 * 공지사항 CSS : s  
 */
/** 위지윅 에디터 */

.ym_layout .ql-editor {
  resize: vertical;
  min-height: 100px;
  height: 200px;
  max-height: 800px;
}

/** 첨부파일 삭제 CSS*/
.deleted_attachement a,
.deleted_attachement .text_red {
  color: #999 !important;
}

.not_allowed {
  cursor: not-allowed !important;
}

.background_remove {
  opacity: 0 !important;
  z-index: auto !important;
  display: none;
}

.position_relative {
  position: absolute;
  pointer-events: none;
}

.window_class .modal-dialog {
  pointer-events: initial;
  transition: none !important;
  position: absolute;
  top: 40px;
  left: 10px;
  -webkit-transform: translate(0, 0) !important;
  -ms-transform: translate(0, 0) !important;
  transform: translate(0, 0) !important;
  opacity: 1 !important;
}

body.modal-open {
  position: fixed !important;
  overflow: hidden;
}

/** 공지사항 팝업 하단 버튼 CSS */
.ym_popup_bottom .right {
  float: right;
  margin-right: 5px;
}

.ym_popup_bottom .right span {
  display: inline-block;
}

.ym_popup_bottom .right a.close {
  width: 20px;
  height: 25px;
  background: url(../images/layer_close_ico.png) no-repeat center 50%;
}

.ym_popup_bottom .left a.closebtn {
  width: 20px !important;
  height: 25px;
  background: url(../images/layer_close_ico.png) no-repeat center 50%;
  float: left;
  font-size: 21px;
  font-weight: 700;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  filter: alpha(opacity=20);
  opacity: 0.2;
  display: inline-block;
}

/**
 * 공지사항 CSS : e  
 */
/**
 * QnA 및 FAQ CSS : s
 */
.reply_table_height {
  border-top: none;
  /* max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden; */
  display: inline-block;
  border-bottom: 1px solid #666;
}

.reply_table_height tr:last-child td {
  border-bottom: none;
}

/**
 * QnA 및 FAQ CSS : e
 */

svg {
  text-align: center;
}

svg.data-graph,
svg.detail-data-graph {
  display: inline-block;
  height: 250px;
  width: 800px;
}

svg.data-graph div,
svg.detail-data-graph div {
  width: 140px;
  height: 50px;
  padding: 15px 0;
  background: white;
  border: 2px solid #9daabc;
  text-align: center;
  border-radius: 5px;
  font-size: 14px;
}

svg.data-graph div.main,
svg.detail-data-graph div.main {
  border-color: #eb8f51;
  background: #f7a268;
  color: white;
}

svg.data-graph div.active,
svg.detail-data-graph div.active {
  border-color: #4d75d5;
  background: #4d75d5;
  color: white;
}

svg.data-graph div.main:hover,
svg.data-graph div.active:hover,
svg.detail-data-graph div.main:hover,
svg.detail-data-graph div.active:hover {
  font-weight: bold;
}

/* 소재표준 소개 */
.ym_standard {
  font-size: 14px;
  color: #555;
}

.ym_standard h2 {
  font-size: 24px;
  color: #666;
  font-weight: 300;
  margin: 10px 0 50px;
  letter-spacing: -0.8px;
  text-align: center;
  line-height: 34px;
}

.ym_standard h2 span {
  color: #192950;
  font-weight: 600;
}

.ym_standard .stardard_text h3 {
  background: url(../images/bullet_blue.svg) no-repeat left;
  font-size: 16px;
  font-weight: 600;
  color: #122455;
  margin-bottom: 9px;
  padding-left: 18px;
}

.ym_standard .stardard_text p {
  padding-left: 18px;
}

.ym_standard .stardard_text ul {
  margin-top: 15px;
  margin-bottom: 50px;
}

.ym_standard .stardard_text ul li {
  padding-left: 18px;
  margin-bottom: 30px;
}

.ym_standard .stardard_text ul li h4 {
  font-size: 15px;
  color: #1e56b6;
  font-weight: 600;
  margin-bottom: 8px;
}

.ym_standard .stardard_text ul li h5 {
  font-size: 14px;
  color: #333;
  font-weight: 600;
  margin-bottom: 8px;
  letter-spacing: -0.5px;
}

/* 프로젝트 소개 */
.ym_intro {
  width: 100%;
  /*height: 150px;*/
  font-weight: 500;
  text-align: center;
  /*background: #e0e9f8 url(../images/bg_main.png) no-repeat center;
    border-bottom: 1px solid #dae4f0;*/
  padding: 25px 0;
  letter-spacing: -0.5px;
}

.ym_intro h1 {
  font-family: Roboto;
  font-size: 50px;
  text-align: center;
  font-weight: bold;
  color: #192950;
  line-height: 60px;
  /*margin-top: 30px;*/
}

.ym_intro h1 span {
  font-weight: 300;
  font-size: 45px;
}

.ym_intro .main_stitle {
  font-size: 15px;
  color: #666;
  text-align: center;
  font-weight: 400;
  letter-spacing: -0.3px;
  margin-top: 10px;
  line-height: 22px;
}

.ym_intro .main_card {
  margin-top: 50px;
  /*margin-bottom: 20px;*/
  display: flex;
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.ym_intro .main_card .card_banner {
  position: relative;
  width: 260px;
  height: 230px;
  padding: 20px 20px 10px;
  background: #ffffff;
  text-align: center;
  border: 1px solid #c9d1db;
  /*box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.15);*/
  border-radius: 5px;
}

.ym_intro .main_card .card_banner:hover {
  cursor: pointer;
  border: 2px solid #122455;
}

.ym_intro .main_card .card_banner img {
  position: absolute;
  width: 100px;
  bottom: 25px;
  left: 32%;
}

.ym_intro .main_card .card_banner h2 {
  font-size: 24px;
  color: #122455;
  font-weight: 600;
}

.ym_intro .main_card .card_banner h2 span {
  font-size: 16px;
  color: #5f6173;
  font-weight: 400;
}

.ym_intro_project {
  position: relative;
  padding: 0;
  border: 1px solid #c9d1db;
  /*margin-bottom:15px;*/
  overflow: hidden;
}

.ym_intro_project .img_div {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  text-align: center;
  vertical-align: middle;
  width: 220px;
  background-color: #f3f7fb;
}

.ym_intro_project .img_div img {
  width: 80px;
  margin-bottom: 10px;
  margin-top: 120px;
}

.ym_intro_project .img_div h3 {
  font-size: 22px;
  color: #122455;
  font-weight: 600;
}

.ym_intro_project .text_div {
  padding-top: 25px;
  padding-bottom: 20px;
  padding-left: 270px;
}

.ym_intro_project .text_div h4 {
  font-size: 16px;
  color: #333;
  margin-bottom: 14px;
}

.ym_intro_project .text_div h4 span {
  color: #444;
  font-weight: 400;
}

.ym_intro_project .text_div.bar {
  border-bottom: 1px solid #e6eaef;
}

.ym_intro_project li {
  position: relative;
  padding-left: 65px;
  line-height: 22px;
  margin: 8px 0;
  font-size: 14px;
  color: #555;
}

.ym_intro_project li b {
  font-weight: 500;
  color: #333;
}

.ym_intro_project li h5.t_bold {
  font-size: 15px;
  display: inline-block;
}

.ym_intro_project li span {
  position: absolute;
  top: 0;
  left: 0;
  color: #fff;
  padding: 2px 14px;
  background: #6f9ae3;
}

.ym_intro_project li span.step02 {
  background: #4c72dc;
}

.ym_intro_project li span.step03 {
  background: #3e62c2;
}

.ym_intro_name {
  height: 15px;
}

.site_menu_shift {
  position: relative;
  left: 150px;
  top: -90px;
}

/** 이용현황 CSS */
.ym_layout .left_div {
  display: block;
  float: left;
  width: 45%;
  height: 400px;
}

.ym_layout .right_div {
  display: block;
  float: right;
  width: 45%;
  height: 400px;
}

.ym_layout .ym_left_greaf_cont {
  width: 100%;
  height: 100%;
}

.ym_layout .ym_right_greaf_cont {
  width: 100%;
  height: 100%;
}

.input-container input {
  box-sizing: border-box;
  outline: 0;
  padding: 0.75rem;
  position: relative;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  background: transparent;
  bottom: 0;
  color: transparent;
  cursor: pointer;
  height: auto;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: auto;
}

/** 이용현황 CSS */

/* 공정분석 */
.analysis_box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.analysis_box .ym_search {
  width: 30%;
}

.analysis_box .arrow_box {
  width: 3.5%;
  text-align: center;
  line-height: 150px;
}

.btn-arrow-b {
  display: inline-block;
  vertical-align: middle;
  line-height: 30px;
  width: 30px;
  height: 30px;
  background: url(../images/icon_arrow_b.svg) no-repeat center;
}

.analysis_box .ym_search .analysis_box_title {
  color: #000;
  font-weight: 500;
  text-align: center;
  background: #fafafa;
  padding: 5px 5px 5px 10px;
  line-height: 24px;
  border-bottom: 1px solid #dadce0;
}

.analysis_box .ym_search .analysis_box_title span {
  float: right;
}

.analysis_box .ym_search .analysis_box_list {
  width: 100%;
  padding: 0px;
  height: 240px;
  overflow: overlay;
}

.analysis_box .ym_search .analysis_box_list li {
  line-height: 20px;
}

.analysis_box .ym_search .analysis_box_list li:hover {
  color: #4c72dc;
  cursor: pointer;
}

.analysis_box .ym_search .analysis_box_list li span {
  padding: 5px 10px;
  display: block;
  width: 100%;
}

.analysis_box .ym_search .analysis_box_list li span.on,
.analysis_box .ym_search .analysis_box_list li:hover span.on {
  font-weight: 500;
  color: #4c72dc;
  background: #edf4ff;
}

.analysis_box .ym_search .analysis_box_list li span.select,
.analysis_box .ym_search .analysis_box_list li:hover span.select {
  height: 30px;
  /*color:#fff;
    background: #7999F3;*/
  color: #3761d2;
  border: 1px solid #3761d2;
}

.analysis_box .ym_search .analysis_box_list li span button {
  display: none;
}

.analysis_box .ym_search .analysis_box_list li span.on button,
.analysis_box .ym_search .analysis_box_list li:hover span.on button,
.analysis_box .ym_search .analysis_box_list li span.select button,
.analysis_box .ym_search .analysis_box_list li:hover span.select button {
  float: right;
  top: 1px;
  margin-right: -5px;
  min-width: 10px;
  display: inline;
  transition: 0.4s;
  -o-transition: 0.4s;
  -moz-transition: 0.4s;
  -webkit-transition: 0.4s;
  right: 10px;
}

.analysis_bottom {
  font-size: 14px;
  letter-spacing: -0.1px;
  padding: 12px 1px 10px;
  background: #fff !important;
  /*border-bottom: 1px solid #bebec1;*/
  margin-top: 20px;
  margin-bottom: 35px;
}

.analysis_bottom span.root-stop01 {
  position: relative;
  color: #1e439f;
  font-weight: 600;
  font-size: 16px;
  /*margin-right:5px;*/
  padding: 4px 0;
  border-radius: 3px;
}

.analysis_bottom span.root-stop01:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  left: 0;
  background: #1e439f;
  bottom: -4px;
}

.analysis_bottom span.root-stop02 {
  position: relative;
  color: #4c72dc;
  letter-spacing: -0.5px;
  font-weight: 500;
  font-size: 16px;
  padding: 4px 5px 4px 8px;
  /*background: #EDF4FF;*/
  /*border: 1px solid #3761d2;*/
  border-radius: 3px;
}

/*
.analysis_bottom span.root-stop02:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 2px;
    left: -5px;
    background: #4c72dc;
    bottom: -6px;
}
*/

/* 조성정보 데이터 그래프 */
.analysis_greaf {
  margin-top: 20px;
  background: #fafafa !important;
  padding: 18px;
  margin-bottom: 10px;
  border: 1px solid #dadce0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.analysis_greaf .ym_search {
  width: 32.5%;
  height: 260px;
  padding: 5px;
  border: 0px;
}

.analysis_greaf .ym_search img {
  width: 100%;
}

.file_drag {
  position: relative;
  background-color: #f3f7fb;
  border: 1px solid #c9d1db;
  margin-top: 10px;
}

.file_drag:hover {
  border: 1px solid #4c72dc;
}

.file_drag .file_text {
  position: absolute;
  top: 38%;
  left: 28%;
  text-align: center;
  line-height: 35px;
  font-size: 30px;
}

/* 분석 모델 관리 */
.model-box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.model-box .model-cont {
  width: 49%;
}

/*팝업 테두리 */
.modal-content {
  border: 0px;
}

/* button menu */
.ym_btn_menu .main_card {
  margin-top: 10px;
  /* margin-bottom: 10px; */
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  color: #1e56b6;
}

.ym_btn_menu .main_card .card_banner {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  width: 80px;
  height: 60px;
  padding: 5px 5px;
  background: #ffffff;
  border: 1px solid grey;
  /* border: 3px solid rgb(255, 255, 255); */
  /* box-shadow: 0px 4px 4px grey; */
  border-radius: 1px;
  margin-left: 5px;
}

.ym-ym_btn_menu.line-blue {
  color: #3761d2 !important;
  background: #fff;
  border: 1px solid #3761d2;
}

.ym_btn_menu .main_card .card_banner:hover {
  cursor: pointer;
  border: 2px solid blue;
}

.ym_btn_menu .main_card .card_banner_selected {
  cursor: pointer;
  border: 2px solid blue;
  background: lightcyan;
}

.ym_btn_menu .main_card .card_banner i {
  font-size: 16px;
}

.ym_btn_menu .main_card .card_banner h2 {
  font-size: 14px;
  color: #122455;
  font-weight: 500;
}

.ym_btn_menu .main_card .card_banner h2 span {
  font-size: 16px;
  color: #5f6173;
  font-weight: 400;
}