.top_tab {
  width: 100%;
  min-width: 1220px;
  height: 59px;
  margin: 0 0 20px 0;
  border-bottom: #35b8e1 2px solid;
}
.top_tab ul {
  vertical-align: top;
  clear: both;
  display: inline-block;
}
.top_tab ul li {
  float: left;
  width: 100px;
  height: 18px;
  margin: 0 2px 0 0;
  padding: 11px 0;
  color: #fff;
  text-align: center;
  border-radius: 4px 4px 0 0;
}
.top_tab ul li.top_tab_off {
  background: #505e67;
}
.top_tab ul li.top_tab_on {
  background: #35b8e1;
}

.top_tab2 {
  width: 100%;
  min-width: 1220px;
  height: 40px;
  margin: 0 0 10px 0;
  border-bottom: #35b8e1 2px solid;
}

.people_box {
  width: 100%;
  min-width: 1180px;
}
.people_subtitle {
  width: 100%;
  margin: 0 0 10px 0;
  color: #fff;
  font-size: 18px;
}
.people_thumbnail {
  width: 100%;
}
.people_thumbnail ul {
  vertical-align: top;
  clear: both;
  display: inline-block;
}
.people_thumbnail ul li {
  position: relative;
  float: left;
  width: 320px;
  height: 140px;
  margin: 0 20px 20px 0;
  border-radius: 4px;
  background: #2f3e47;
}
.people_subtitle_pic {
  position: absolute;
  width: 90px;
  height: 90px;
  left: 20px;
  top: 25px;
  border-radius: 90px;
  background: url(../img/com/pic_basic.jpg) no-repeat;
  background-size: 100%;
}
.people_subtitle_txt_box {
  position: absolute;
  width: 270px;
  height: 100px;
  right: 20px;
  top: 20px;
}
.people_subtitle_txt01 {
  width: 270px;
  color: #fff;
}
.people_subtitle_txt02 {
  width: 270px;
  font-size: 12px;
  color: #d4d7d9;
}

.sub_title {
  width: 100%;
  height: 25px;
  margin: 10px 0 30px 0;
  font-size: 23px;
  color: #fff;
}
.setup_box {
  width: 700px;
  padding: 30px;
  border-radius: 4px;
  background: #2f3e47;
  vertical-align: top;
  clear: both;
  display: inline-block;
}
.setup_pic_box {
  float: left;
  width: 216px;
}
.setup_pic {
  width: 200px;
  height: 200px;
  border-radius: 216px;
  background: url(../img/com/pic_basic.jpg) no-repeat;
  background-size: 100%;
}
.setup_pic_txt {
  width: 200px;
  font-size: 13px;
  text-align: center;
  color: #d4d7d9;
  line-height: 1.2em;
  margin: 10px 0;
}
.setup_pic_btn {
  width: 120px;
  height: 16px;
  padding: 8px 0;
  margin: 0 auto;
  font-size: 15px;
  line-height: 1em;
  text-align: center;
  color: #fff;
  border-radius: 4px;
  background: #6e787f;
}
.setup_db_box {
  float: left;
  width: 660px;
}
.setup_db_table {
  width: 660px;
}
.setup_db_table_W60 {
  width: 60px;
  color: #d4d7d9;
}
.setup_db_table_W255 {
  width: 255px;
}
.setup_db_table_W30 {
  width: 30px;
  height: 9px;
}
.setup_db_table_T12 {
  font-size: 12px;
  color: #d4d7d9;
}
.setup_db_btn_box {
  width: 325px;
  height: 46px;
  margin: 28px auto 0;
}
.setup_db_btn_box ul {
  vertical-align: top;
  clear: both;
  display: inline-block;
}
.setup_db_btn_box ul li {
  float: left;
  width: 100px;
  height: 20px;
  padding: 13px 0;
  margin: 0 4px;
  border-radius: 4px;
  color: #fff;
  font-size: 18px;
  line-height: 1em;
  text-align: center;
}
.setup_db_btn_box ul li.setup_db_btn01 {
  background: #35b8e1;
}
.setup_db_btn_box ul li.setup_db_btn02 {
  background: #505e67;
}
.setup_db_btn_box ul li.setup_db_btn03 {
  background: #ff0000;
}

.con_box {
  position: absolute;
  width: 97%;
  padding: 20px;
  left: 0;
  right: 0;
  margin: 0 0 20px 0;
  border-radius: 4px;
  background: #2f3e47;
}
.con_boxr {
  position: static;
  width: 97%;
  padding: 20px;
  margin: 0 0 20px 0;
  border-radius: 4px;
  background: #2f3e47;
}

.list_top {
  position: relative;
  width: 100%;
  height: 42px;
}
.list_top_btn {
  position: relative;
  width: 100px;
  height: 18px;
  padding: 12px 0px;
  margin-right: 10px;
  color: #fff;
  font-size: 16px;
  line-height: 1em;
  border-radius: 3px;
  text-align: center;
  background: #666666;
  cursor: pointer;
  float: left;
}
.list_search {
  position: absolute;
  width: 85%;
  height: 28px;
  margin: 7px 0;
  left: 0;
}
.list_search ul {
  vertical-align: top;
  clear: both;
  display: inline-block;
}
.list_search ul li {
  float: left;
}
.list_search ul li label {
  color: white;
}
.list_search_btn {
  width: 70px;
  padding: 6px 0;
  color: #fff;
  line-height: 1em;
  border-radius: 3px;
  text-align: center;
  background: #6e787f;
  cursor: pointer;
}
.list_download_btn {
  width: 70px;
  padding: 6px 0;
  color: #fff;
  line-height: 1em;
  border-radius: 3px;
  text-align: center;
  background: #66aa66;
  cursor: pointer;
}
.list_request_btn {
  position: absolute;
  width: 110px;
  height: 18px;
  padding: 12px 0;
  right: 0;
  color: #fff;
  font-size: 16px;
  line-height: 1em;
  border-radius: 3px;
  text-align: center;
  background: #35b8e1;
  cursor: pointer;
}
.list_request_btn2 {
  position: relative;
  width: 100px;
  height: 18px;
  padding: 12px 0px;
  margin-right: 10px;
  color: #fff;
  font-size: 16px;
  line-height: 1em;
  border-radius: 3px;
  text-align: center;
  background: #35b8e1;
  cursor: pointer;
  float: right;
}
.list_table {
  width: 100%;
  margin: 10px 0 0 0;
  border-top: 2px solid #35b8e1;
}
.list_table td {
  height: 34px;
  color: #fff;
  font-weight: 300;
  text-align: center;
  border-bottom: 1px solid #6e787f;
}
.list_table td.list_table_title {
  height: 40px;
  background: #505e67;
}
.list_table td.list_txt_C {
  color: #c7cacc;
}
.list_num_table {
  height: 21px;
  text-decoration: none;
  margin: 20px auto 0;
}
.list_num_table td {
  width: 26px;
  height: 21px;
  color: #fff;
  font-weight: 300;
  text-align: center;
}
.list_num_table td.list_num_C {
  color: #35b8e1;
}

.write_table {
  width: 100%;
  border-top: 2px solid #35b8e1;
}
.write_table td {
  height: 40px;
  color: #fff;
  font-weight: 300;
  text-align: center;
  border-bottom: 1px solid #6e787f;
}
.write_table td.write_title {
  background: #505e67;
}
.write_table td.write_txt {
  padding: 0 10px;
  text-align: left;
  width: 200px;
}
.write_table td.write_txtc {
  padding: 0 10px;
  text-align: center;
  width: 200px;
}
.write_table td.view_txt {
  padding: 20px 10px;
  text-align: left;
}
.write_textarea {
  padding: 10px;
  margin: 10px 0;
  width: 818px;
  border: none;
  border-radius: 3px;
  font-size: 14px;
}
.write_textarea_full {
  padding: 10px;
  margin: 10px 0;
  width: 100%;
  border: none;
  border-radius: 3px;
  font-size: 14px;
}
.write_btn {
  text-align: center;
  width: 90%;
  height: 42px;
  margin: 20px auto 0;
}
.write_btn ul {
  vertical-align: top;
  clear: both;
  display: inline-block;
}
.write_btn ul li {
  float: left;
  width: 110px;
  height: 18px;
  padding: 12px 0;
  margin: 0 3px;
  color: #fff;
  font-size: 16px;
  line-height: 1em;
  border-radius: 3px;
  text-align: center;
  cursor: pointer;
}
.write_btn ul li.write_btn01 {
  background: #35b8e1;
}
.write_btn ul li.write_btn02 {
  background: #505e67;
}
.write_btn ul li.write_btn03 {
  background: #c44;
}

.view_title_txt {
  font-size: 18px;
  color: #fff;
  margin: 20px 0 0 0;
}
.view_table {
  width: 100%;
  margin: 10px 0 0 0;
  border-top: 2px solid #35b8e1;
}
.view_table td {
  height: 40px;
  color: #fff;
  font-weight: 300;
  text-align: center;
  border-bottom: 1px solid #6e787f;
}
.view_table td.view_title {
  background: #505e67;
}
.view_table td.view_name {
  padding: 0 10px;
  text-align: left;
  background: #505e67;
}
.view_table td.view_txt01 {
  padding: 20px 10px;
  text-align: left;
}
.view_table td.view_txt02 {
  padding: 0 10px;
  text-align: left;
}
.view_time {
  padding: 0 10px;
  float: right;
}

.board_table {
  position: absolute;
  width: 100%;
}
.board_table.width_1000 {
  width: 1000px;
}
.board_table__wrap {
  margin-bottom: 17px;
}
.board_table__header {
  margin-bottom: 10px;
  font-size: 16px;
  color: #bac0d5;
}
.board_table th,
.board_table td {
  min-height: 53px;
  padding: 9px 10px;
  font-size: 14px;
  text-align: center;
}
.board_table th {
  background: #32384e;
  color: #969db5;
  font-weight: bold;
}
.board_table td,
.board_table a {
  text-align: center;
  color: #bac0d5;
}
.board_table a {
}
.board_table td {
  border-bottom: 1px solid #3b4158;
}
.board_table tr.active td {
  background: #1c1f2d;
}
.board_table a:hover {
  text-decoration: underline;
}
.board_table__btn--wrap {
  display: flex;
  justify-content: center;
}
.board_table__btn--icon {
  width: 34px;
  height: 34px;
  background: #32384e;
  border-radius: 100%;
}
.board_table__btn--icon:hover {
  background: #2f354a;
}
.board_table__btn--icon:not(:last-child) {
  margin-right: 5px;
}
.board_table__title {
  display: none;
}
.board_table__content {
  word-break: break-all;
}
.board_table__content--comment {
  margin-left: 10px;
  color: white;
  position: relative;
  padding-left: 20px;
}
.fa-comment-dots:before {
  position: absolute;
  left: 0;
}
.board_table__content.title {
  width: 500px;
}
.board_table__content .round {
  width: 55px;
  background: #644dff;
  border-radius: 35px;
  padding: 4px 13px;
  color: #bac0d5;
  display: inline-block;
}
.board_table__content.color,
.board_table__content--anchor.color {
  color: #9686ff;
}
.board_table__content.grey {
  color: #454b64;
}
.board_table__col--left {
  text-align: left !important;
}
.board_table__col--right {
  text-align: right !important;
}

.modal {
  position: absolute;
  width: 100vw;
  height: 100vh;
  left: 0;
  top: 0;
  z-index: 100;
  display: none;
}
.modal__bg {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.6);
  z-index: 99;
}
.modal__content {
  min-width: 415px;
  position: fixed;
  top: 50%;
  left: 50%;
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background: #2a2f42;
  border: 1px solid #7d8998;
  border-radius: 5px;
  z-index: 101;
  padding: 25px;
}
.modal__header {
  display: flex;
  justify-content: space-between;
  color: #fff;
  font-size: 18px;
  font-weight: 400;
}
.modal__btn--close {
  position: relative;
  border: none;
  background: none;
}
.modal__btn--close::before,
.modal__btn--close::after {
  content: '';
  display: block;
  position: absolute;
  width: 15px;
  height: 2px;
  background: #969db5;
  right: 0;
}
.modal__btn--close::before {
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.modal__btn--close::after {
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.modal__box {
  margin-top: 30px;
}
.modal__form--list > li:not(:last-of-type) {
  margin-bottom: 20px;
}
.modal__form--receipt {
  height: 500px;
  overflow: auto;
}
.modal__form--item {
  display: flex;
}
.modal__form--item_box {
  display: flex;
}
.modal__form--item_box:not(:last-of-type) {
  margin-right: 15px;
}
.modal__form--title {
  display: flex;
  align-items: start;
  width: 85px;
  font-size: 14px;
  color: #969db5;
  font-weight: 700;
  padding-top: 5px;
}
.modal__form--title--400 {
  display: flex;
  align-items: center;
  width: 400px;
  font-size: 14px;
  color: #969db5;
  font-weight: 700;
}
.modal__form--content {
  display: flex;
  align-items: center;
  width: 100%;
  margin-left: 15px;
}
.modal__form--content--text {
  display: flex;
  align-items: right;
  width: 300px;
  margin-left: 15px;
  color: #969db5;
}
.modal__form--content.m-l-0 {
  margin-left: 0;
}
.modal__form--content .form__span--file {
  width: calc(100% - 80px);
}

.modal__form--content .form__span--file2 {
  width: calc(100% - 80px);
}

.modal__form--content textarea.view_form__content--txt {
  width: 100%;
  height: 125px;
  resize: none;
}
.modal__form--content .view_form__content--txt:not(:last-of-type) {
  margin-right: 10px;
}
.modal__form--item_btn {
  display: flex;
  justify-content: flex-end;
}
.modal__form--item_btn > [class^='btn']:not(:last-child) {
  margin-right: 10px;
}
.modal__form--item_btn .btn_orange,
.modal__form--item_btn .btn_purple,
.modal__form--item_btn .btn_grey,
.modal__form--item_btn .btn_light_grey,
.modal__form--item_btn .btn_light_grey2 {
  padding: 5px 8px;
  border-radius: 5px;
}
.modal__header--left {
  display: flex;
  align-items: center;
}
.modal__header--left > *:not(:last-child) {
  margin-right: 8px;
}
.modal__header--template_down {
  font-size: 12px;
  color: #969db5;
}
.modal .board__select {
  width: 100%;
  height: 30px;
}