@charset "UTF-8";
.search_page .closebox {
  color: rgba(161, 161, 161, 0.85);
}
.search_page .closebox:hover {
  color: #333333;
}
.search_page .search_screen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10000;
}
.search_page .search {
  display: table;
  width: 100%;
}
.search_page .search .flex {
  display: flex;
}
.search_page .search.loading {
  pointer-events: none;
}
.search_page .search .block {
  float: left;
  min-height: 40px;
  padding: 0 16px;
  margin-bottom: 16px;
}
.search_page .search .block.date_area, .search_page .search .block.team_area, .search_page .search .block.category_area, .search_page .search .block.score_area {
  width: 50%;
}
.search_page .search .block.keyword_area {
  flex: 1 0 0;
}
.search_page .search .block.keyword_area .reset {
  color: #CCCCCC;
  font-size: 24px;
  line-height: 24px;
  cursor: pointer;
  z-index: 1020;
}
.search_page .search .block.wordcloud_toggle_area {
  margin: 16px 0px 0px;
}
.search_page .search .block.working_time_area {
  padding: 0 16px 0 8px;
}
.search_page .search .block.working_time_area .title {
  color: #4472ba;
  font-weight: 700;
}
.search_page .search .block.working_time_area .working_time {
  display: flex;
  justify-content: center;
}
.search_page .search .block.working_time_area .working_time label {
  align-items: center;
  background: #d5dadf;
  border-radius: 50px;
  display: flex;
  justify-content: space-around;
  height: 40px;
  position: relative;
  transition: 0.1s;
  width: 96px;
}
.search_page .search .block.working_time_area .working_time label::before {
  background: #fff;
  border-radius: 100%;
  content: "";
  display: inline-block;
  height: 32px;
  position: absolute;
  left: 4px;
  width: 32px;
  z-index: 2;
}
.search_page .search .block.working_time_area .working_time label span {
  color: #fff;
  font-size: 14px;
  position: absolute;
  left: 20%;
}
.search_page .search .block.working_time_area .working_time label span.working_time_off {
  left: auto;
  right: 20%;
}
.search_page .search .block.working_time_area .working_time input {
  display: none;
}
.search_page .search .block.working_time_area .working_time input:checked + label {
  background: #4472ba;
}
.search_page .search .block.working_time_area .working_time input:checked + label::before {
  left: auto;
  right: 4px;
}
.search_page .search .block.button_area {
  margin-bottom: 20px;
  margin-top: 24px;
  text-align: center;
  width: 100%;
}
.search_page .search .block.center {
  width: 100%;
  text-align: center;
  min-height: 30px;
}
.search_page .search .block .title {
  margin-bottom: 8px;
}
.search_page .search .block .ml4 {
  margin-left: 4px;
}
.search_page .search input[type=text] {
  width: 100%;
  box-sizing: border-box;
}
.search_page .search input[type=text]:focus {
  box-shadow: none;
  border-color: #CCCCCC;
  outline: 0;
}
.search_page .search input[type=text]::placeholder {
  margin-left: 0;
  color: #BABABA;
  opacity: 1;
}
.search_page .search select {
  border-bottom: 1px solid #CCCCCC;
  border-radius: unset;
  padding: 8px 32px 8px 24px;
  font-size: 14px;
}
.search_page .search select:focus {
  box-shadow: none;
  border-color: #CCCCCC;
  outline: 0;
}
.search_page .search button {
  outline: 0;
  background-color: transparent;
  border: none;
}
.search_page .search button.btn {
  height: 40px;
  border-radius: 5px;
  color: #FFFFFF;
  width: 160px;
}
.search_page .search button.btn.reset {
  background: #FFFFFF;
  border: 1px solid #a5a5a5;
  color: #686868;
  margin-right: 16px;
}
.search_page .search button.btn.reset:hover {
  background-color: #f1f1f1;
  border-color: #adadad;
}
.search_page .search button.btn.submit {
  position: relative;
  background-color: #4472ba;
  border: 1px solid #4472ba;
}
.search_page .search button.btn.submit:hover {
  background-color: #3560a2;
  border-color: #3560a2;
}
.search_page .search button.btn.submit .loading_mini {
  position: absolute;
  right: 8px;
  top: 7px;
  display: inline-block;
  width: 24px;
  height: 24px;
  border: 3px solid #FFFFFF;
  border-image: initial;
  border-radius: 50%;
  border-right-color: transparent;
  animation: rotation-frame 0.75s linear infinite;
}
.search_page .search button.btn:hover, .search_page .search button.btn:active, .search_page .search button.btn:focus {
  outline: 0;
}
.search_page .search button.wordcloud_button {
  border: 1px solid #CCCCCC;
  border-radius: 5px;
  color: #FFFFFF;
  background-color: #000;
  padding: 2px 8px;
  margin-left: 8px;
  cursor: pointer;
}
.search_page .search button.wordcloud_button:hover {
  opacity: 0.5;
}
.search_page .search .input-group .input-group-addon {
  padding: 8px;
  border-left: none;
  border-right: none;
  border-top: none;
  border-bottom: 1px solid #CCCCCC;
  color: #BABABA;
}
.search_page .search .suggest_box {
  position: absolute;
  display: block;
  width: 45%;
  padding: 24px;
  background-color: #FFFFFF;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
  border-radius: 5px;
  z-index: 10010;
}
.search_page .search .suggest_box .suggest_contents {
  max-height: 275px;
  overflow-y: scroll;
}
.search_page .search .suggest_box .closebox {
  position: absolute;
  top: 20px;
  right: 40px;
  font-size: 18px;
}
.search_page .search .suggest_box .title {
  color: rgba(161, 161, 161, 0.85);
  margin-bottom: 12px;
  text-align: left;
}
.search_page .search .suggest_box .chips {
  text-align: left;
  margin-bottom: 12px;
}
.search_page .search .suggest_box .chips button {
  background: #EEEEEE;
  padding: 8px 10px;
  color: #333333;
  font-size: 14px;
  border-radius: 14px;
  display: inline-block;
  margin: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.search_page .search .suggest_box .chips button.checked {
  background: #EEEEEE;
  cursor: default;
  color: #0614d4;
}
.search_page .search .suggest_box .chips button.checked:focus {
  box-shadow: none;
}
.search_page .search .suggest_box .chips button:hover, .search_page .search .suggest_box .chips button:focus {
  box-shadow: none;
}
.search_page .search .suggest_box .no_data {
  margin-bottom: 16px;
  padding: 8px;
  text-align: center;
  color: #CCCCCC;
  padding: 8px;
  border: 2px dotted #CCCCCC;
}
.search_page .search .input_field {
  position: relative;
  border: solid 1px #CCCCCC;
  border-radius: 4px;
  display: flex;
  align-items: center;
}
.search_page .search .input_field .icon {
  width: 24px;
  height: 24px;
  margin-left: 4px;
}
.search_page .search .MuiInput-input {
  border: none !important;
  text-align: left;
  padding: 8px;
  line-height: normal;
  height: auto;
}
.search_page .search .MuiFormControl-root {
  width: 100%;
  min-height: 36px;
  z-index: 1009;
}
.search_page .search .MuiInput-root {
  width: 100%;
  height: 36px;
  font-size: inherit;
}
.search_page .search .MuiInput-root:focus {
  outline: 0;
}
.search_page .search .MuiSelect-icon {
  top: auto;
}
.search_page .search .daterange {
  text-align: left;
  height: 36px;
  padding: 8px;
  cursor: pointer;
  border: solid 1px #CCCCCC;
  border-radius: 4px;
}
.search_page .search .date_box {
  position: absolute;
  display: block;
  padding: 24px;
  background-color: #FFFFFF;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
  border-radius: 5px;
  z-index: 1110;
}
.search_page .search .date_box .closebox {
  position: absolute;
  top: 20px;
  right: 18px;
  font-size: 18px;
}
.search_page .search .date_box .button_area {
  border-top: 1px solid #EEEEEE;
  padding-top: 16px;
}
.search_page .search .date_box .button_area button {
  border-radius: 5px;
  padding: 8px 16px;
  min-width: 112px;
}
.search_page .search .date_box .button_area button.cancel {
  color: #FFFFFF;
  background: rgba(161, 161, 161, 0.85);
  border: 1px solid #CCCCCC;
  margin-right: 16px;
}
.search_page .search .date_box .button_area button.cancel:hover {
  background-color: #7e7e7e;
  border-color: #adadad;
}
.search_page .search .date_box .button_area button.done {
  color: #FFFFFF;
  background-color: #337ab7;
  border: 1px solid #2e6da4;
  margin-left: 16px;
}
.search_page .search .date_box .button_area button.done:hover {
  background-color: #286090;
  border-color: #204d74;
}
.search_page .search .date_box .button_area button:hover, .search_page .search .date_box .button_area button:active, .search_page .search .date_box .button_area button:focus {
  outline: 0;
}
.search_page .search .date_box .rdrMonthAndYearWrapper {
  margin-bottom: 24px;
}
.search_page .search .date_box .rdrMonthAndYearPickers {
  flex-direction: row-reverse;
  margin-top: 16px;
}
.search_page .search .date_box .rdrDateDisplayWrapper {
  display: none;
}
.search_page .search .date_box .rdrMonthName {
  text-align: center;
  color: #000000;
}
.search_page .search .date_box .rdrPprevButton {
  position: absolute;
  top: 114px;
  left: 24px;
}
.search_page .search .date_box .rdrNextButton {
  position: absolute;
  top: 114px;
  right: 24px;
}
.search_page .search .date_box ~ .search_screen {
  z-index: 1100;
}
.search_page .search .MuiSelect-select:focus {
  background-color: #FFFFFF !important;
}
.search_page .search .chip {
  margin: 5px;
  font-size: 12px;
  background-color: #EEEEEE;
  height: 25px;
  border: none;
  border-radius: 10px;
  display: flex;
  align-items: center;
}
.search_page .search .chip .MuiChip-deleteIcon {
  margin-right: 0px;
  margin-left: 0px;
  height: 15px;
}
.search_page .search div[class*=WAMuiChipInput-chipContainer-] {
  min-height: 36px;
}
.search_page .search div[class*=jss]:before,
.search_page .search div[class*=WAMuiChipInput-underline-]:before,
.search_page .search .MuiInput-underline:before {
  border-bottom: none !important;
  transition: none !important;
}
.search_page .search div[class*=jss]:after,
.search_page .search div[class*=WAMuiChipInput-underline-]:after,
.search_page .search .MuiInput-underline:after {
  border-bottom: none !important;
  transition: none !important;
}
.search_page .flex-table {
  display: inline-table;
  table-layout: fixed;
  width: calc(100% - 32px);
}
.search_page .flex-table thead {
  color: #777;
}
.search_page .flex-table thead tr,
.search_page .flex-table tbody tr {
  display: flex;
  min-height: 50px;
}
.search_page .flex-table thead tr th,
.search_page .flex-table thead tr td,
.search_page .flex-table tbody tr th,
.search_page .flex-table tbody tr td {
  display: flex;
  padding: 0.5em;
  align-items: center;
}
.search_page .flex-table thead tr th button,
.search_page .flex-table thead tr td button,
.search_page .flex-table tbody tr th button,
.search_page .flex-table tbody tr td button {
  min-width: auto;
}
.search_page .flex-table thead tr th button.update,
.search_page .flex-table thead tr td button.update,
.search_page .flex-table tbody tr th button.update,
.search_page .flex-table tbody tr td button.update {
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  border-radius: 4px;
  padding: 4px 16px;
  color: #656E73;
}
.search_page .flex-table thead tr th button.update:hover,
.search_page .flex-table thead tr td button.update:hover,
.search_page .flex-table tbody tr th button.update:hover,
.search_page .flex-table tbody tr td button.update:hover {
  background-color: #656E73;
  color: #FFFFFF;
}
.search_page .flex-table thead tr th button.update:focus,
.search_page .flex-table thead tr td button.update:focus,
.search_page .flex-table tbody tr th button.update:focus,
.search_page .flex-table tbody tr td button.update:focus {
  outline: none;
}
.search_page .flex-table thead tr th button.update:disabled,
.search_page .flex-table thead tr td button.update:disabled,
.search_page .flex-table tbody tr th button.update:disabled,
.search_page .flex-table tbody tr td button.update:disabled {
  color: #d0d3d5;
  border: 1px solid #d0d3d5;
  background-color: #FFFFFF;
}
.search_page .flex-table thead tr th button.delete,
.search_page .flex-table thead tr td button.delete,
.search_page .flex-table tbody tr th button.delete,
.search_page .flex-table tbody tr td button.delete {
  background-color: #C61616;
  border: 1px solid #C61616;
  color: #FFFFFF;
}
.search_page .flex-table thead tr th button.delete:hover,
.search_page .flex-table thead tr td button.delete:hover,
.search_page .flex-table tbody tr th button.delete:hover,
.search_page .flex-table tbody tr td button.delete:hover {
  background-color: #d75b5b;
  color: #FFFFFF;
}
.search_page .flex-table thead tr th button.delete:focus,
.search_page .flex-table thead tr td button.delete:focus,
.search_page .flex-table tbody tr th button.delete:focus,
.search_page .flex-table tbody tr td button.delete:focus {
  outline: none;
}
.search_page .flex-table thead tr th button.mini_menu_button,
.search_page .flex-table thead tr td button.mini_menu_button,
.search_page .flex-table tbody tr th button.mini_menu_button,
.search_page .flex-table tbody tr td button.mini_menu_button {
  background-color: transparent;
  border: none;
}
.search_page .flex-table thead tr th button.mini_menu_button:focus,
.search_page .flex-table thead tr td button.mini_menu_button:focus,
.search_page .flex-table tbody tr th button.mini_menu_button:focus,
.search_page .flex-table tbody tr td button.mini_menu_button:focus {
  outline: none;
}
.search_page .flex-table thead tr th button.flex,
.search_page .flex-table thead tr td button.flex,
.search_page .flex-table tbody tr th button.flex,
.search_page .flex-table tbody tr td button.flex {
  display: flex;
  align-items: center;
}
.search_page .flex-table thead tr th .title,
.search_page .flex-table thead tr td .title,
.search_page .flex-table tbody tr th .title,
.search_page .flex-table tbody tr td .title {
  color: #4472BA;
  cursor: pointer;
}
.search_page .flex-table thead tr th .title:hover,
.search_page .flex-table thead tr td .title:hover,
.search_page .flex-table tbody tr th .title:hover,
.search_page .flex-table tbody tr td .title:hover {
  text-decoration: underline;
}
.search_page .flex-table thead tr th .icon,
.search_page .flex-table thead tr td .icon,
.search_page .flex-table tbody tr th .icon,
.search_page .flex-table tbody tr td .icon {
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.search_page .flex-table thead tr th.no_data,
.search_page .flex-table thead tr td.no_data,
.search_page .flex-table tbody tr th.no_data,
.search_page .flex-table tbody tr td.no_data {
  width: 100% !important;
  height: 300px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  flex-wrap: wrap;
}
.search_page .flex-table thead tr th.no_data .text,
.search_page .flex-table thead tr td.no_data .text,
.search_page .flex-table tbody tr th.no_data .text,
.search_page .flex-table tbody tr td.no_data .text {
  font-size: 30px;
  color: #CCCCCC;
  margin-bottom: 16px;
}
.search_page .flex-table thead tr th .generating,
.search_page .flex-table thead tr td .generating,
.search_page .flex-table tbody tr th .generating,
.search_page .flex-table tbody tr td .generating {
  color: #fd6a6a;
  font-weight: bold;
}
.search_page .flex-table thead tr.stopped,
.search_page .flex-table tbody tr.stopped {
  color: #BFC4C9;
}
.search_page .flex-table thead tr.stopped .title,
.search_page .flex-table tbody tr.stopped .title {
  color: #BFC4C9;
  cursor: default;
}
.search_page .flex-table thead tr.stopped .title:hover,
.search_page .flex-table tbody tr.stopped .title:hover {
  text-decoration: none;
}
.search_page .flex-table tbody tr {
  border-bottom: 1px solid #999;
}
.search_page .flex-table.search_result_detail {
  margin: 36px 16px 16px;
}
.search_page .flex-table.search_result_detail.pager {
  min-height: 594px;
}
.search_page .flex-table.search_result_detail tbody {
  height: 100%;
}
.search_page .flex-table.search_result_detail th,
.search_page .flex-table.search_result_detail td {
  word-break: break-all;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.search_page .flex-table.search_result_detail th:nth-child(1),
.search_page .flex-table.search_result_detail td:nth-child(1) {
  width: 10%;
}
.search_page .flex-table.search_result_detail th:nth-child(2),
.search_page .flex-table.search_result_detail td:nth-child(2) {
  flex: 1 1 0;
}
.search_page .flex-table.search_result_detail th:nth-child(3),
.search_page .flex-table.search_result_detail td:nth-child(3) {
  color: #777;
  width: 14%;
  justify-content: center;
}
.search_page .flex-table.search_result_detail th:nth-child(4),
.search_page .flex-table.search_result_detail td:nth-child(4) {
  color: #777;
  width: 10%;
  justify-content: center;
}
.search_page .flex-table.search_result_detail th:nth-child(5),
.search_page .flex-table.search_result_detail td:nth-child(5) {
  color: #777;
  width: 8.2%;
  justify-content: center;
}
.search_page .flex-table.search_result_detail th:nth-child(6),
.search_page .flex-table.search_result_detail td:nth-child(6) {
  width: 16px;
  justify-content: center;
}
.search_page .flex-table.search_result_detail th:nth-child(7),
.search_page .flex-table.search_result_detail td:nth-child(7) {
  width: 11%;
  justify-content: flex-end;
}
.search_page .flex-table.search_result_detail th:nth-child(8),
.search_page .flex-table.search_result_detail td:nth-child(8) {
  width: 11%;
  justify-content: flex-end;
}
.search_page .flex-table.search_result_detail th:nth-child(9),
.search_page .flex-table.search_result_detail td:nth-child(9) {
  width: 11%;
  justify-content: flex-end;
}
.search_page .flex-table.search_result_detail th .hour,
.search_page .flex-table.search_result_detail td .hour {
  color: #4472ba;
  font-size: 20px;
  font-weight: 700;
  margin: 0px 1px 0px 0px;
}
.search_page .flex-table.search_result_detail th .minute,
.search_page .flex-table.search_result_detail th .second,
.search_page .flex-table.search_result_detail th .biz,
.search_page .flex-table.search_result_detail th .count,
.search_page .flex-table.search_result_detail td .minute,
.search_page .flex-table.search_result_detail td .second,
.search_page .flex-table.search_result_detail td .biz,
.search_page .flex-table.search_result_detail td .count {
  color: #4472ba;
  display: inline-block;
  font-size: 20px;
  font-weight: 700;
  margin: 0px 1px 0 3px;
  min-width: 23px;
  text-align: right;
}
.search_page .flex-table.search_result_detail th .sort_button,
.search_page .flex-table.search_result_detail td .sort_button {
  cursor: pointer;
}
.search_page .flex-table.search_result_detail th .sort_icon_area,
.search_page .flex-table.search_result_detail td .sort_icon_area {
  width: 24px;
  padding: 8px;
}
.search_page .flex-table.search_result_detail th {
  border-bottom: 1px solid #999;
}
.search_page .flex-table.search_result_detail th.blank_title {
  border-top: none;
}
.search_page .flex-table.search_result_detail th:nth-child(3), .search_page .flex-table.search_result_detail th:nth-child(4) {
  justify-content: center;
}
.search_page .flex-table.search_result_detail th:nth-child(5) {
  justify-content: center;
  padding-right: 0;
}
.search_page .flex-table.search_result_detail th:nth-child(7), .search_page .flex-table.search_result_detail th:nth-child(9) {
  border-top: 1px solid #999;
}
.search_page .flex-table.search_result_detail th:nth-child(8) {
  border-top: 1px solid #999;
  position: relative;
}
.search_page .flex-table.search_result_detail th:nth-child(8) .detail_table_title {
  color: #777;
  font-weight: 700;
  left: 50%;
  position: absolute;
  top: -24px;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
.search_page .flex-table.search_result_detail td:nth-child(3), .search_page .flex-table.search_result_detail td:nth-child(4) {
  padding-right: 16px;
}
.search_page .flex-table.search_result_detail.not_ai.pager {
  min-height: 474px;
}
.search_page .flex-table.search_result_detail.not_ai th:nth-child(3),
.search_page .flex-table.search_result_detail.not_ai td:nth-child(3) {
  width: 25%;
}
.search_page .flex-table.search_result_detail.not_ai th:nth-child(4),
.search_page .flex-table.search_result_detail.not_ai td:nth-child(4) {
  width: 21%;
}
.search_page .flex-table.search_result_detail.not_ai th:nth-child(5),
.search_page .flex-table.search_result_detail.not_ai td:nth-child(5) {
  width: 19.2%;
}
.search_page .search_result {
  border-bottom: 1px solid #999;
}
.search_page .search_result .search_result_header {
  align-items: center;
  display: flex;
  margin: 0 -40px;
  padding: 40px 40px 47px;
}
.search_page .search_result .search_result_header .search_result_title {
  font-size: 20px;
  font-weight: 600;
  margin-right: 20px;
}
.search_page .detail_box {
  border-bottom: 1px solid #fff;
  border-left: 1px solid #fff;
  border-right: 1px solid #fff;
  border-top: 1px solid #999;
}
.search_page .detail_box .detail_summary_wrapper {
  padding-top: 12px;
  display: flex;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary {
  align-items: center;
  display: flex;
  flex: auto;
  justify-content: space-between;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary.graph {
  flex: unset;
  width: 32.6%;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary.graph .detail_block {
  justify-content: center;
  width: 33.3333333333%;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary.graph.title .detail_block {
  width: 116px;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_header {
  align-items: flex-start;
  display: flex;
  flex: 1 1 0;
  width: 200px;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_header .app_icon_wrapper {
  width: 70px;
  text-align: center;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_header .app_icon_wrapper .app_icon {
  align-items: center;
  border-radius: 50px;
  box-shadow: 0px 0px 3px #ccc;
  display: flex;
  justify-content: center;
  height: 36px;
  margin: 2px auto 0;
  width: 36px;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_header .app_icon_wrapper .app_icon svg {
  height: 1.6rem;
  width: 1.6rem;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_header .app_icon_wrapper .app_name {
  color: #999;
  font-size: 13px;
  margin-top: 5px;
  padding: 0 2px;
  width: 70px;
  word-break: break-all;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_header .app_title_wrapper {
  color: #333;
  font-size: 15px;
  overflow: hidden;
  width: 100%;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_header .app_title_wrapper .app_title {
  display: -webkit-box;
  font-weight: 600;
  height: 41px;
  line-height: 1.33;
  margin: 0 8px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_header .app_title_wrapper .app_title.no_title {
  color: #bcbcbc;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_header .app_title_wrapper .app_url {
  color: #bcbcbc;
  font-size: 13px;
  height: 15px;
  margin: 8px 8px 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_header .detail_more_button_wrapper {
  display: flex;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_header .detail_more_button_wrapper .detail_more_button {
  border: 1px solid #ccc;
  border-radius: 50px;
  color: #656e73;
  cursor: pointer;
  display: inline-block;
  font-size: 13px;
  margin: 8px 8px 12px;
  min-width: 120px;
  padding: 4px 8px;
  text-align: center;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_header .detail_more_button_wrapper .detail_more_button .ml4 {
  margin-left: 4px;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_header .detail_more_button_wrapper .detail_more_button.active {
  background: #999;
  color: #fff;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_block {
  display: flex;
  justify-content: center;
  padding-right: 4px;
  width: 15%;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_block .value {
  color: #777;
  font-size: 11px;
  margin-bottom: 4px;
  margin-top: 4px;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_block .value .hour,
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_block .value .biz,
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_block .value .count {
  color: #4472ba;
  font-size: 20px;
  font-weight: 700;
  margin: 0px 1px 0px 0px;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_block .value .minute,
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_block .value .second {
  color: #4472ba;
  font-size: 20px;
  font-weight: 700;
  margin: 0 1px 0 3px;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_block.blank {
  border: none;
  width: 16px;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_block.time {
  width: 20%;
  margin: 0;
  color: inherit;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary .detail_block.count {
  width: 14%;
}
.search_page .detail_box .detail_summary_wrapper .detail_summary.active {
  border: none;
}
.search_page .detail_box .detail_app_title {
  color: #333;
  font-size: 15px;
  font-weight: 700;
  margin: 20px 16px 0;
}
.search_page .detail_box .detail_app_title.no_title {
  color: #bcbcbc;
}
.search_page .detail_box .detail_app_url {
  color: #bcbcbc;
  font-size: 13px;
  margin: 10px 16px 0;
}
.search_page .detail_box .pagination {
  display: flex;
  justify-content: flex-end;
  margin: 0 0 30px;
}
.search_page .detail_box .pagination .page {
  padding: 4px 8px;
  cursor: pointer;
  margin: 0px 4px;
  min-width: 42px;
  text-align: center;
  color: #666666;
}
.search_page .detail_box .pagination .page:hover {
  color: #333333;
}
.search_page .detail_box .pagination .page.selected {
  color: #0041f3;
}
.search_page .detail_box .pagination .page.disabled {
  color: #CCCCCC;
  cursor: not-allowed;
}
.search_page .detail_box.summary_title {
  border-top: none;
  color: #777;
  font-size: 16px;
  font-weight: 600;
  margin-top: 40px;
}
.search_page .detail_box.summary_title .detail_summary_wrapper .detail_block {
  border-top: 1px solid #999;
  justify-content: center;
  line-height: 1.25;
  padding: 8px;
  position: relative;
}
.search_page .detail_box.summary_title .detail_summary_wrapper .detail_block:not(:last-child)::before {
  content: "|";
  position: absolute;
  right: -1px;
}
.search_page .detail_box.summary_title .detail_summary_wrapper .detail_block:nth-child(4) {
  padding-right: 4px;
}
.search_page .detail_box.summary_title .detail_summary_wrapper .detail_block:nth-child(4)::before {
  content: "";
}
.search_page .detail_box.summary_title .detail_summary_wrapper .detail_block .business_stress,
.search_page .detail_box.summary_title .detail_summary_wrapper .detail_block .business_focus,
.search_page .detail_box.summary_title .detail_summary_wrapper .detail_block .business_efficiency {
  color: #4472ba;
}
.search_page .detail_box.summary_title .detail_summary_wrapper .detail_block .detail_summary_table_title {
  font-weight: 400;
  position: absolute;
  top: -24px;
}
.search_page .detail_box.active {
  border: 1px solid #999;
  border-radius: 6px;
  margin-bottom: 12px;
}
.search_page .MuiMenu-list:focus {
  outline: 0;
}
.search_page .MuiMenu-list li {
  border-bottom: 1px solid #CCCCCC;
  padding: 15px 10px;
  font-size: unset;
}
.search_page .MuiMenu-list li:last-child {
  border-bottom: none;
}
.search_page .error_field {
  padding: 5px;
  color: #FF0000;
  font-size: 12px;
}
.search_page .error_field:before {
  content: "※";
}
.search_page .hint_field {
  padding: 5px;
  color: #185500;
  font-size: 12px;
}
.search_page .hint_field:before {
  content: "※";
}
.search_page .wordcloud_wrap {
  position: relative;
  padding: 0px;
  border-radius: 10px;
  margin-bottom: 16px;
}
.search_page .wordcloud_wrap .MuiSelect-select:focus {
  background-color: #FFFFFF !important;
  border-radius: inherit;
}
.search_page .wordcloud_wrap .WAMuiChipInput-underline-14:before,
.search_page .wordcloud_wrap .WAMuiChipInput-underline-31:before,
.search_page .wordcloud_wrap .MuiInput-underline:before {
  border-bottom: none !important;
  transition: none !important;
}
.search_page .wordcloud_wrap .WAMuiChipInput-underline-14:after,
.search_page .wordcloud_wrap .WAMuiChipInput-underline-31:after,
.search_page .wordcloud_wrap .MuiInput-underline:after {
  border-bottom: none !important;
  transition: none !important;
}
.search_page .wordcloud_wrap .wordcloud_select {
  background-color: #FFFFFF;
  border: 1px solid #CCCCCC;
  width: 200px;
  border-radius: 5px;
}
.search_page .wordcloud_wrap .wordcloud_select .MuiInput-root {
  width: 100%;
  font-size: unset;
}
.search_page .wordcloud_wrap .wordcloud_select .MuiInput-root:focus {
  outline: 0;
}
.search_page .wordcloud_wrap .wordcloud_select .MuiInput-input {
  border: none !important;
  text-align: left;
  padding-left: 20px;
}
.search_page .wordcloud_wrap .wordcloud_select .MuiSelect-icon {
  top: auto;
}
.search_page .wordcloud_wrap .wordcloud_detail {
  background-color: transparent;
  border: none;
  box-shadow: none;
  display: flex;
  justify-content: space-between;
}
.search_page .wordcloud_wrap .wordcloud_image {
  box-sizing: border-box;
  text-align: center;
  height: 360px;
  margin-bottom: 0px;
}
.search_page .wordcloud_wrap .wordcloud_image img {
  width: 100%;
}
.search_page .wordcloud_wrap .no_image {
  position: absolute;
  background-color: #FFFFFF;
  width: 634px;
  height: 130px;
  padding: 40px;
  box-sizing: border-box;
  color: #BABABA;
  text-align: left;
}
.search_page .wordcloud_wrap .no_image .title {
  font-size: 20px;
  margin-bottom: 8px;
}
.search_page .wordcloud_wrap .no_image .message {
  font-size: 16px;
}
.search_page .wordcloud_wrap .wordcloud_area {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(51, 51, 51, 0.8);
  border-radius: 10px;
  z-index: 1110;
}
.search_page .wordcloud_wrap .wordcloud_area button {
  outline: 0;
  background-color: transparent;
  border: none;
}
.search_page .wordcloud_wrap .wordcloud_area button:hover, .search_page .wordcloud_wrap .wordcloud_area button:focus, .search_page .wordcloud_wrap .wordcloud_area button:active {
  outline: 0;
}
.search_page .wordcloud_wrap .wordcloud_area .view_more {
  position: absolute;
  bottom: -4px;
  left: calc(50% - 20px);
  color: #FFFFFF;
  animation: bound 1s ease-in infinite;
}
.search_page .wordcloud_wrap .wordcloud_area .closebox {
  position: absolute;
  top: 5px;
  right: 5px;
  font-size: 30px;
}
.search_page .wordcloud_wrap .wordcloud_area .closebox:hover {
  color: #FFFFFF;
}
.search_page .wordcloud_wrap .wordcloud_area .chips {
  text-align: left;
  margin: 24px 16px;
  overflow-y: scroll;
  height: 312px;
}
.search_page .wordcloud_wrap .wordcloud_area .chips button {
  background: #3AC458;
  padding: 8px 10px;
  color: #FFFFFF;
  font-size: 14px;
  border-radius: 14px;
  display: inline-block;
  margin: 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
.search_page .wordcloud_wrap .wordcloud_area .chips button.checked {
  background: #A1A1A1;
  cursor: default;
}
.search_page .wordcloud_wrap .wordcloud_area .chips button:hover, .search_page .wordcloud_wrap .wordcloud_area .chips button:focus {
  box-shadow: 0 0 5px 2px #FFFFFF;
}
.search_page .wordcloud_wrap .wordcloud_area .no_data {
  color: #FFFFFF;
  font-size: 24px;
  margin-top: 160px;
}
.search_page .wordcloud_wrap .wordcloud_area ~ .search_screen {
  z-index: 1100;
}
.search_page button.rank_1 {
  background: #13411D;
}
.search_page button.rank_2 {
  background: #1B5B29;
}
.search_page button.rank_3 {
  background: #237635;
}
.search_page button.rank_4 {
  background: #2A9040;
}
.search_page button.rank_5 {
  background: #32AA4C;
}
.search_page .wordcloud_search {
  max-width: 1000px;
  margin: auto;
}
.search_page .wordcloud_search_image {
  margin: 40px 0;
}
.search_page .wordcloud_search_image.no_data {
  width: 100%;
}
.search_page .search_condition_area {
  margin-bottom: 40px !important;
  padding-bottom: 0;
}
.search_page .top_back {
  position: fixed;
  z-index: 9999;
  right: 30px;
  bottom: 30px;
}
.search_page .top_back button {
  width: 64px;
  height: 64px;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 32px;
  background: #497ecd;
  color: #FFFFFF;
  visibility: hidden;
  opacity: 0.3;
  display: flex;
}
.search_page .top_back button.active {
  opacity: 1;
  visibility: visible;
  transition: all 500ms ease-in;
}
.search_page .top_back button:focus {
  outline: none;
}
.search_page .result_header {
  width: 100%;
  padding-top: 24px;
  text-align: center;
}
.search_page .result_header .result_title {
  font-size: 20px;
}
.search_page .result_header .result_title strong {
  font-size: 32px;
  font-weight: normal;
  vertical-align: baseline;
}
.search_page .search_result_num.center {
  display: flex;
  justify-content: center;
}
.search_page .search_result_num.between {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.search_page .result_title {
  color: #666;
  font-size: 20px;
}
.search_page .result_no_data {
  margin: 24px;
  text-align: center;
  font-size: 14px;
  padding-bottom: 200px;
}
.search_page .result_wrapper {
  padding: 40px;
  background: #FFFFFF;
  margin: 12px 0 0;
  border-radius: 4px;
}
.search_page .result_wrapper .summary .summary_title {
  font-size: 20px;
  font-weight: 600;
  padding-bottom: 30px;
}
.search_page .result_wrapper .summary .graph_area {
  display: flex;
  justify-content: space-between;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper {
  padding: 0 30px 0 10px;
  width: 33%;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail {
  align-items: baseline;
  color: #333;
  display: flex;
  font-size: 14px;
  line-height: 1.42;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail .head {
  font-size: 18px;
  font-weight: 600;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail .hour,
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail .minute,
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail .biz,
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail .count {
  font-size: 30px;
  font-weight: 600;
  margin: 0 4px 0 8px;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail .second {
  font-size: 30px;
  font-weight: bold;
  margin: 0 4px;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail .total {
  margin-left: auto;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail.title {
  border-bottom: 1px solid #707070;
  line-height: 2;
  margin-top: 10px;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail.title .head {
  font-size: 16px;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail_lists {
  font-size: 14px;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail_list {
  align-items: center;
  display: flex;
  margin-top: 14px;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail_list .name {
  overflow: hidden;
  text-align: right;
  width: 95px;
  white-space: nowrap;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail_list .bar-graph-wrapper {
  flex: auto;
  margin-left: 10px;
  overflow: hidden;
  position: relative;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail_list .bar-graph-wrapper .bar-graph {
  background: #eee;
  height: 14px;
  position: relative;
  width: 75%;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail_list .bar-graph-wrapper .bar-graph .value {
  bottom: 0;
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail_list .bar-graph-wrapper .bar-graph .value.time_bar {
  background: #00e396;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail_list .bar-graph-wrapper .bar-graph .value.operation {
  background: #00cccc;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail_list .bar-graph-wrapper .bar-graph .value.count {
  background: #008ffb;
}
.search_page .result_wrapper .summary .graph_area .graph_detail_wrapper .graph_detail_list .amount {
  bottom: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.search_page .result_wrapper .summary .graph_area_toggle_wrapper {
  margin: 24px 0 0;
}
.search_page .result_wrapper .summary .graph_area_toggle_wrapper .graph_area_toggle {
  align-items: center;
  border-bottom: 1px solid #ccc;
  border-top: 1px solid #ccc;
  color: #656e73;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 600;
  justify-content: center;
  line-height: 1;
  margin: 0 -40px;
  padding: 8px 20px;
}
.search_page .result_wrapper .summary .graph_area_toggle_wrapper .graph_area_toggle .icon {
  margin-left: 4px;
}
.search_page .result_wrapper .summary .graph_area_toggle_wrapper .graph_area_toggle .icon .svg-inline--fa {
  font-size: 20px;
}
.search_page .result_wrapper .summary .graph_area_toggle_wrapper .graph_area_toggle.checked {
  border-bottom: 1px solid #ccc;
}
.search_page .result_wrapper .summary .graph_area_toggle_open {
  border-top: 1px solid #ccc;
  margin: 24px -40px 16px;
}
.search_page .result_wrapper .summary .graph_area_button {
  display: flex;
  justify-content: center;
  margin-top: 30px;
  padding-bottom: 30px;
}
.search_page .result_wrapper .summary .graph_area_button .button {
  align-items: center;
  background: #999;
  border-radius: 50px;
  color: #fff;
  display: flex;
  font-size: 13px;
  font-weight: 600;
  justify-content: center;
  height: 32px;
  width: 122px;
}
.search_page .result_wrapper .summary .graph_area_button .button .icon {
  margin-left: 8px;
}
.search_page .result_wrapper .filter_area {
  display: flex;
  justify-content: space-between;
  margin-bottom: 24px;
}
.search_page .result_wrapper .filter_area .tag_area {
  width: 100%;
}
.search_page .result_wrapper .filter_area .tag_area .title {
  color: #898989;
  margin-bottom: 4px;
}
.search_page .result_wrapper .filter_area .tag_area .detail.thin {
  height: 38px;
  overflow: hidden;
}
.search_page .result_wrapper .filter_area .tag_area .detail .tag_toggle {
  align-items: center;
  border: 1px solid #4472ba;
  border-radius: 6px;
  color: #4472ba;
  display: flex;
  font-size: 16px;
  justify-content: center;
  height: 38px;
  margin-bottom: 8px;
  width: calc(100% - 28px);
}
.search_page .result_wrapper .filter_area .tag_area .detail .tag_toggle .ml4 {
  margin-left: 4px;
}
.search_page .result_wrapper .filter_area .tag_area .detail .tag_toggle.close {
  background: #999;
  border: 1px solid #999;
  color: #fff;
}
.search_page .result_wrapper .filter_area .tag_area .tags {
  display: flex;
  flex-wrap: wrap;
  width: calc(100% - 28px);
}
.search_page .result_wrapper .filter_area .tag_area .tags .tag {
  border: solid 1px #CCC;
  border-radius: 5px;
  padding: 4px 8px;
  color: #898989;
  cursor: pointer;
  margin: 0 8px 8px 0;
}
.search_page .result_wrapper .filter_area .tag_area .tags .tag:hover {
  border: solid 1px #4e585d;
  color: #4e585d;
}
.search_page .result_wrapper .filter_area .tag_area .tags .tag.active {
  border: solid 1px #4e585d;
  color: #4e585d;
  background-color: #F5F5F5;
}
.search_page .result_wrapper .filter_area .sort_area {
  color: #777;
  display: flex;
  font-size: 14px;
  justify-content: flex-start;
  position: relative;
}
.search_page .result_wrapper .filter_area .sort_area .result_sort {
  border: solid 1px #777;
  border-radius: 6px;
  cursor: pointer;
  height: 38px;
  padding: 8px 30px 8px 8px;
}
.search_page .result_wrapper .filter_area .sort_area .sort_area_icon {
  position: absolute;
  right: 14px;
  top: 11px;
  transform: rotate(90deg);
}
.search_page .result_wrapper .total_title {
  padding-top: 56px;
  text-align: center;
  font-size: 20px;
}
.search_page .result_wrapper .total_data {
  display: flex;
  margin-right: 16px;
  margin-left: 16px;
  padding-top: 40px;
  padding-bottom: 40px;
  padding-left: 40px;
  padding-right: 40px;
}
.search_page .result_wrapper .result_data_title {
  padding-top: 56px;
  text-align: center;
  font-size: 20px;
  margin-bottom: 56px;
}
.search_page .result_wrapper .result_detail {
  margin-left: 16px;
  margin-right: 16px;
  margin-bottom: 40px;
  border: 1px solid rgba(161, 161, 161, 0.85);
  border-radius: 10px;
}
.search_page .result_wrapper .result_detail_title {
  word-break: break-word;
  padding-top: 16px;
  padding-bottom: 16px;
  padding-left: 40px;
  padding-right: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: all 0.5s linear;
}
.search_page .result_wrapper .result_detail_title span,
.search_page .result_wrapper .result_detail_title a {
  font-size: 18px;
}
.search_page .result_wrapper .result_detail_title.display_hidden {
  background-color: #CCCCCC;
  transition: all 0.5s linear;
}
.search_page .result_wrapper .result_detail_title .title_area {
  display: flex;
  align-items: center;
}
.search_page .result_wrapper .result_detail_title .title_area .app_label {
  padding: 2px 8px;
  font-size: 12px;
  margin-right: 8px;
  height: fit-content;
}
.search_page .result_wrapper .result_detail_data {
  padding: 40px;
  display: flex;
  border-radius: 10px;
  visibility: visible;
  opacity: 1;
  overflow: hidden;
}
.search_page .result_wrapper .display_hidden + .result_detail_data {
  padding: 0 40px;
  visibility: hidden;
  opacity: 0;
  max-height: 0;
}
.search_page .result_wrapper .work_time,
.search_page .result_wrapper .work_point {
  width: 50%;
}
.search_page .result_wrapper .work_time .work_time_header,
.search_page .result_wrapper .work_time .work_point_header,
.search_page .result_wrapper .work_point .work_time_header,
.search_page .result_wrapper .work_point .work_point_header {
  text-align: center;
}
.search_page .result_wrapper .work_time .work_time_header .work_time_title,
.search_page .result_wrapper .work_time .work_time_header .work_point_title,
.search_page .result_wrapper .work_time .work_point_header .work_time_title,
.search_page .result_wrapper .work_time .work_point_header .work_point_title,
.search_page .result_wrapper .work_point .work_time_header .work_time_title,
.search_page .result_wrapper .work_point .work_time_header .work_point_title,
.search_page .result_wrapper .work_point .work_point_header .work_time_title,
.search_page .result_wrapper .work_point .work_point_header .work_point_title {
  font-size: 16px;
  color: rgba(161, 161, 161, 0.85);
}
.search_page .result_wrapper .work_time .work_time_header .work_time_title strong,
.search_page .result_wrapper .work_time .work_time_header .work_point_title strong,
.search_page .result_wrapper .work_time .work_point_header .work_time_title strong,
.search_page .result_wrapper .work_time .work_point_header .work_point_title strong,
.search_page .result_wrapper .work_point .work_time_header .work_time_title strong,
.search_page .result_wrapper .work_point .work_time_header .work_point_title strong,
.search_page .result_wrapper .work_point .work_point_header .work_time_title strong,
.search_page .result_wrapper .work_point .work_point_header .work_point_title strong {
  font-size: 24px;
  font-weight: normal;
  vertical-align: baseline;
  color: #333333;
}
.search_page .result_wrapper .total_data .work_time .work_time_header .work_time_title strong,
.search_page .result_wrapper .total_data .work_time .work_time_header .work_point_title strong,
.search_page .result_wrapper .total_data .work_time .work_point_header .work_time_title strong,
.search_page .result_wrapper .total_data .work_time .work_point_header .work_point_title strong,
.search_page .result_wrapper .total_data .work_point .work_time_header .work_time_title strong,
.search_page .result_wrapper .total_data .work_point .work_time_header .work_point_title strong,
.search_page .result_wrapper .total_data .work_point .work_point_header .work_time_title strong,
.search_page .result_wrapper .total_data .work_point .work_point_header .work_point_title strong {
  font-size: 32px;
}
.search_page .result_wrapper .toggle_switch {
  position: relative;
  height: 38px;
}
.search_page .result_wrapper .toggle_switch .toggle_label {
  width: 140px;
  height: 38px;
  background: #FFFFFF;
  position: relative;
  display: inline-block;
  border-radius: 46px;
  transition: 0.4s;
  box-sizing: border-box;
  border: 1px solid #CCCCCC;
}
.search_page .result_wrapper .toggle_switch .toggle_label .include {
  position: absolute;
  top: 8px;
  left: 13px;
  z-index: 10;
  color: #CCCCCC;
  font-weight: normal;
  font-size: 14px;
  pointer-events: none;
}
.search_page .result_wrapper .toggle_switch .toggle_label .exclude {
  position: absolute;
  top: 8px;
  right: 12px;
  z-index: 10;
  color: #FFFFFF;
  font-weight: normal;
  font-size: 14px;
  pointer-events: none;
}
.search_page .result_wrapper .toggle_switch .toggle_label .back_ground {
  content: "";
  position: absolute;
  width: 74px;
  height: 30px;
  border-radius: 20px;
  right: 3px;
  top: 3px;
  z-index: 2;
  background: #A1A1A1;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  transition: 0.4s;
}
.search_page .result_wrapper .toggle_switch .toggle_label .back_ground.en {
  width: 69px;
}
.search_page .result_wrapper .toggle_switch .toggle_input {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  opacity: 0;
  cursor: pointer;
}
.search_page .result_wrapper .toggle_switch .toggle_input:checked ~ .include {
  color: #FFFFFF;
}
.search_page .result_wrapper .toggle_switch .toggle_input:checked ~ .exclude {
  color: #CCCCCC;
}
.search_page .result_wrapper .toggle_switch .toggle_input:checked ~ .back_ground {
  background: #000000;
  right: 87px;
  width: 48px;
}
.search_page .result_wrapper .toggle_switch .toggle_input:checked ~ .back_ground.en {
  right: 68px;
  width: 67px;
}
.search_page .more_section {
  margin-top: 40px;
  margin-bottom: 40px;
  text-align: center;
}
.search_page .more_section:after {
  content: "";
  display: block;
  margin-top: -20px;
  width: 100%;
  height: 1px;
  background-color: rgba(161, 161, 161, 0.85);
}
.search_page .more_section button {
  width: 240px;
  height: 40px;
  background: #FFFFFF;
  border-radius: 20px;
  border: 1px solid rgba(161, 161, 161, 0.85);
  outline: none;
}
.search_page .loading_wrapper {
  position: absolute;
  top: calc(50% - 100px);
  left: calc(50% - 100px);
  width: 33.33%;
  height: 33.33%;
  max-width: 200px;
  max-height: 200px;
  min-width: 190px;
  min-height: 190px;
  display: inline-block;
}
.search_page .loading_wrapper * {
  letter-spacing: normal;
  white-space: normal;
}
.search_page .loading_wrapper span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 12px;
  animation: loading_text 1.5s infinite linear forwards;
}
.search_page .loading_wrapper .spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transform-origin: center;
  width: 190px;
  height: 190px;
}
.search_page .loading_wrapper .spinner.type1 {
  border-radius: 50%;
  border-width: 11px;
  border-style: solid;
  border-color: #4a7ecd rgba(204, 204, 204, 0.12) rgba(204, 204, 204, 0.12);
  animation: spinner 1.5s infinite linear forwards;
}
.search_page .loading_area {
  background-color: #FFF;
  width: 100%;
  height: 300px;
  position: absolute;
  z-index: 1000;
}
.search_page .loading_area.none {
  animation: fade_out 0.75s linear forwards;
}
.search_page .download_csv_area {
  font-size: 14px;
  position: relative;
  display: flex;
  justify-content: flex-end;
}
.search_page .download_csv_area button {
  display: inline-block;
  border: 1px solid #4472ba;
  border-radius: 4px;
  padding: 7px 16px;
}
.search_page .download_csv_area button.toggle {
  align-items: center;
  background-color: rgba(68, 114, 186, 0.1);
  color: #4472BA;
  display: flex;
}
.search_page .download_csv_area button.toggle .icon {
  height: 24px;
  width: 24px;
}
.search_page .download_csv_area button.toggle svg g {
  fill: #4472BA;
}
.search_page .download_csv_area button.toggle:hover {
  color: #FFFFFF;
  background-color: #4472BA;
}
.search_page .download_csv_area button.toggle:hover svg g {
  fill: #FFFFFF;
}
.search_page .download_csv_area button.download {
  color: #656E73;
  background-color: #FFFFFF;
}
.search_page .download_csv_area button.download:hover {
  color: #FFFFFF;
  background-color: #656E73;
}
.search_page .download_csv_area button:disabled {
  color: #CCCCCC;
  background-color: #FAFAFA;
  border: solid 1px #EEEEEE;
}
.search_page .download_csv_area button:disabled:hover {
  color: #CCCCCC;
  background-color: #FAFAFA;
}
.search_page .download_csv_area .download_csv_modal {
  display: block;
  background-color: #FFFFFF;
  position: absolute;
  top: 50px;
  right: 0;
  z-index: 2050;
  text-align: left;
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  box-shadow: 0px 0px 3px #CCCCCC;
  width: max-content;
}
.search_page .download_csv_area .download_csv_modal.none {
  display: none;
}
.search_page .download_csv_area .download_csv_modal .title {
  padding: 16px;
  border-bottom: 1px solid #CCCCCC;
}
.search_page .download_csv_area .download_csv_modal .detail {
  padding: 16px;
}
.search_page .download_csv_area .download_csv_modal .detail .button_area {
  display: flex;
  justify-content: space-between;
}
.search_page .download_csv_area .download_csv_modal .detail .button_area button {
  margin-right: 16px;
}
.search_page .download_csv_area .download_csv_modal .detail .button_area button:last-of-type {
  margin-right: 0;
}
.search_page .download_csv_area .download_csv_modal .detail .comment {
  margin: 16px 0 0 0;
  color: #A8AFB4;
  font-size: 12px;
}
.search_page .diagnosis {
  position: relative;
}
.search_page .diagnosis .y_title {
  color: #333333;
  font-size: 11px;
  margin: 0 12px -12px;
}
.search_page .diagnosis .x_title {
  color: #333333;
  text-align: center;
  font-size: 11px;
  margin: -8px 0;
}
.search_page .diagnosis .graph {
  height: 100%;
}
.search_page .diagnosis .graph table {
  table-layout: fixed;
  width: 100%;
  height: 100%;
}
.search_page .diagnosis .graph td {
  border-collapse: collapse;
  border: 1px solid #FFFFFF;
  background-color: #ECF0F5;
}
.search_page .diagnosis .graph tr:nth-child(n+1):nth-child(-n+4) td:nth-child(n+1):nth-child(-n+4) {
  background-color: #DFDFF0;
}
.search_page .diagnosis .graph tr:nth-child(n+1):nth-child(-n+4) td:nth-child(n+5):nth-child(-n+8) {
  background-color: #ECF0F5;
}
.search_page .diagnosis .graph tr:nth-child(n+5):nth-child(-n+8) td:nth-child(n+1):nth-child(-n+4) {
  background-color: #C5BFE8;
}
.search_page .diagnosis .graph tr:nth-child(n+5):nth-child(-n+8) td:nth-child(n+5):nth-child(-n+8) {
  background-color: #AB9EE0;
}
.search_page .diagnosis .usage {
  margin: 24px 0 16px;
}
.search_page .diagnosis .usage > div:nth-child(1) svg {
  background-color: #68E8C0;
}
.search_page .diagnosis .usage > div:nth-child(2) svg {
  background-color: #9DEBD5;
}
.search_page .diagnosis .usage > div:nth-child(3) svg {
  background-color: #D1EEEA;
}
.search_page .diagnosis .usage > div:nth-child(3) svg g use {
  fill: #00E396;
}
.search_page .diagnosis .usage > div:nth-child(4) svg {
  background-color: #ECF0F5;
}
.search_page .diagnosis .usage > div:nth-child(4) svg g use {
  fill: #00E396;
}
.search_page .search_condition_menu {
  display: block;
  background-color: #FFFFFF;
  border-radius: 8px;
  border: 1px solid #CCCCCC;
  position: absolute;
  top: 40px;
  left: 0;
  z-index: 2040;
  transform: translateX(-35%);
  min-width: 350px;
}
.search_page .search_condition_menu .title {
  padding: 8px 16px;
  border-bottom: solid 1px #CCCCCC;
  font-weight: bold;
}
.search_page .search_condition_menu .no_data {
  padding: 8px;
  color: #898989;
}
.search_page .search_condition_menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.search_page .search_condition_menu ul li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 24px;
  border-bottom: solid 1px #CCCCCC;
}
.search_page .search_condition_menu ul li .icon {
  width: 24px;
  height: 24px;
}
.search_page .search_condition_menu ul li .icon svg g use {
  fill: currentColor;
}
.search_page .search_condition_menu ul li .comment {
  visibility: hidden;
  position: absolute;
  top: -45px;
  left: 50%;
  width: max-content;
  border-radius: 5px;
  background-color: #000000;
  padding: 8px 16px;
  color: #FFF;
  opacity: 0.7;
  text-align: center;
  transform: translateX(-50%);
  font-size: 12px;
}
.search_page .search_condition_menu ul li .comment:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -10px;
  border: 10px solid transparent;
  border-top: 10px solid #000000;
}
.search_page .search_condition_menu ul li button {
  border: none;
  background-color: transparent;
  position: relative;
}
.search_page .search_condition_menu ul li button:hover {
  fill: #6e0808;
}
.search_page .search_condition_menu ul li button:hover svg g use {
  fill: #6e0808;
}
.search_page .search_condition_menu ul li button:hover .comment {
  visibility: visible;
}
.search_page .search_condition_menu ul li .name {
  cursor: pointer;
  color: #286090;
  position: relative;
}
.search_page .search_condition_menu ul li .name:hover {
  text-decoration: underline;
}
.search_page .search_condition_menu ul li .name:hover .comment {
  visibility: visible;
}
.search_page .search_condition_menu ul li .action_area {
  display: flex;
}
.search_page .search_condition_menu.none {
  z-index: -1;
}
.search_page .search_condition_button {
  color: #4472ba;
  position: relative;
  background-color: rgba(68, 114, 186, 0.1);
  border: 1px solid #4472ba;
  margin-left: 16px;
  height: 40px;
  border-radius: 5px;
  display: inline-flex;
  align-items: center;
}
.search_page .search_condition_button:hover {
  background-color: #4472ba;
  border-color: #4472ba;
  color: #fff;
}
.search_page .search_condition_button:hover .icon svg g path {
  fill: #fff;
}
.search_page .search_condition_button:focus, .search_page .search_condition_button:active:focus {
  color: #FFFFFF;
  outline: none;
}
.search_page .search_condition_button .icon {
  width: 24px;
  height: 24px;
  margin-right: 4px;
}
.search_page .search_condition_button .icon svg g path {
  fill: #4472ba;
}
.search_page .wordcloud_toggle {
  margin: 0 -40px;
  padding: 16px 20px;
  color: #656E73;
  cursor: pointer;
  border-top: 1px solid #CCCCCC;
  border-bottom: 1px solid #CCCCCC;
  position: relative;
  text-align: left;
}
.search_page .search_condition_open_button {
  position: absolute;
  top: 50%;
  right: 30px;
  border: solid 1px #a6b4bb;
  border-radius: 50%;
  width: 34px;
  height: 34px;
  transform: translateY(-50%);
}
.search_page .search_condition_open_check {
  display: none;
}
.search_page .search_condition_open_check + div::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: 20px;
  height: 2px;
  background-color: #656E73;
}
.search_page .search_condition_open_check + div::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transition: 0.4s;
  transform: translateX(-50%) translateY(-50%) rotate(0deg);
  width: 2px;
  height: 20px;
  background-color: #656E73;
}
.search_page .search_condition_open_check.checked + div::after {
  transition: 0.4s;
  transform: translateX(-50%) translateY(-50%) rotate(270deg);
}

@keyframes spinner {
  0% {
    -webkit-transform: translate(-50%, -50%) rotate(0);
    transform: translate(-50%, -50%) rotate(0);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) rotate(360deg);
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
@keyframes loading_text {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes bound {
  0%, 100% {
    transform: scale(1);
  }
  25% {
    transform: scale(1.55);
  }
  50% {
    transform: scale(0.95);
  }
  75% {
    transform: scale(1.15);
  }
}
@keyframes fade_out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    z-index: -1;
  }
}
@charset "UTF-8";
/*Start Wizard*/
.bootstrapWizard {
  display: inline;
  list-style: none;
  padding: 0;
  position: relative;
}
.bootstrapWizard span {
  margin: 6px 6px;
  margin-top: 24px;
}
.bootstrapWizard span.active.complete .step {
  background: #094E8D;
  color: #fff;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  display: inline-block;
}
.bootstrapWizard span.active .step {
  background: #094E8D;
  color: #fff;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  display: inline-block;
}
.bootstrapWizard span.complete .step {
  background: #0aa66e;
  padding: 1px 6px;
  border: 3px solid #55606E;
}
.bootstrapWizard span.complete .title {
  color: #2B3D53;
}
.bootstrapWizard span .step {
  background: rgba(9, 78, 141, 0.15);
  color: #fff;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  display: inline-block;
  z-index: 2;
}
.bootstrapWizard span .step i {
  font-size: 10px;
  font-weight: 400;
  position: relative;
  top: -1.5px;
}
.bootstrapWizard a:hover, .bootstrapWizard a:active, .bootstrapWizard a:focus {
  text-decoration: none;
}

.wizard-actions {
  display: block;
  list-style: none;
  padding: 0;
  position: relative;
  width: 100%;
}
.wizard-actions li {
  display: inline;
}

.step-area {
  text-align: center;
}

.download-link {
  font-size: 40px;
  font-weight: bold;
  text-decoration: underline;
}

.prev-button {
  background: #F9F9F9;
  color: #FFFFFF;
  margin-top: 0px;
}

.next-button {
  background: #094E8D;
  color: #FFFFFF;
  margin-top: 0px;
}

.disable-next-button {
  background: #6f8db2;
  color: #FFFFFF;
  margin-top: 0px;
}

.intro-tooltip {
  min-width: 400px;
}
.intro-tooltip .introjs-prevbutton {
  background: #FFFFFF;
  color: #46A0F8;
  border-style: none;
}
.intro-tooltip .introjs-nextbutton {
  background: #094E8D;
  color: #FFFFFF;
  margin-left: 4px;
  text-shadow: none;
  text-decoration: none;
}
.intro-tooltip .introjs-skipbutton {
  display: none;
}
.intro-tooltip li a {
  pointer-events: none;
}

.first-tooltip {
  min-width: 300px;
}
.first-tooltip .introjs-prevbutton {
  background: #FFFFFF;
  color: #46A0F8;
  border-style: none;
}
.first-tooltip .introjs-nextbutton {
  background: #094E8D;
  color: #FFFFFF;
  margin-left: 4px;
  text-shadow: none;
  text-decoration: none;
}
.first-tooltip .introjs-skipbutton {
  display: none;
}
.first-tooltip li a {
  pointer-events: none;
}

.second-tooltip {
  min-width: 600px;
}
.second-tooltip .introjs-prevbutton {
  background: #FFFFFF;
  color: #46A0F8;
  border-style: none;
}
.second-tooltip .introjs-nextbutton {
  background: #094E8D;
  color: #FFFFFF;
  margin-left: 4px;
  text-shadow: none;
  text-decoration: none;
}
.second-tooltip .introjs-skipbutton {
  display: none;
}
.second-tooltip li a {
  pointer-events: none;
}

.third-tooltip {
  min-width: 460px;
}
.third-tooltip .introjs-prevbutton {
  background: #FFFFFF;
  color: #46A0F8;
  border-style: none;
}
.third-tooltip .introjs-donebutton {
  background: #094E8D;
  color: #FFFFFF;
  margin-left: 4px;
  text-shadow: none;
  text-decoration: none;
}
.third-tooltip li a {
  pointer-events: none;
}

.fourth-tooltip {
  min-width: 320px;
}
.fourth-tooltip .introjs-prevbutton {
  background: #FFFFFF;
  color: #46A0F8;
  border-style: none;
}
.fourth-tooltip .introjs-nextbutton {
  background: #094E8D;
  color: #FFFFFF;
  margin-left: 4px;
  text-shadow: none;
  text-decoration: none;
}
.fourth-tooltip .introjs-skipbutton {
  display: none;
}
.fourth-tooltip li a {
  pointer-events: none;
}

.fifth-tooltip {
  min-width: 420px;
}
.fifth-tooltip .introjs-prevbutton {
  background: #FFFFFF;
  color: #46A0F8;
  border-style: none;
}
.fifth-tooltip .introjs-nextbutton {
  background: #094E8D;
  color: #FFFFFF;
  margin-left: 4px;
  text-shadow: none;
  text-decoration: none;
}
.fifth-tooltip .introjs-skipbutton {
  display: none;
}
.fifth-tooltip li a {
  pointer-events: none;
}

.sixth-tooltip {
  min-width: 420px;
}
.sixth-tooltip .introjs-prevbutton {
  background: #FFFFFF;
  color: #46A0F8;
  border-style: none;
}
.sixth-tooltip .introjs-donebutton {
  background: #094E8D;
  color: #FFFFFF;
  margin-left: 4px;
  text-shadow: none;
  text-decoration: none;
}
.sixth-tooltip li a {
  pointer-events: none;
}

.highlight {
  opacity: 0.2;
}

/*End Wizard*/
/* Start tutorial-modal */
.tutorial button {
  width: 10%;
  height: 50px;
  margin-top: 14px;
  font-size: 14px;
  border-radius: 4px;
}
.tutorial .modal-title {
  color: #333333;
  margin-top: 50px;
  font-weight: 700;
  font-size: 26px;
  display: flex;
  justify-content: center;
}
.tutorial .modal-title.password, .tutorial .modal-title.sso-connect, .tutorial .modal-title.set-occupation {
  margin-bottom: 24px;
  margin-top: 40px;
}
.tutorial .modal-title.password .blue, .tutorial .modal-title.sso-connect .blue, .tutorial .modal-title.set-occupation .blue {
  color: #4472BA;
}
.tutorial .modal-description {
  width: 100%;
  font-family: Helvetica;
  font-style: normal;
  font-weight: normal;
  font-size: 28px;
  line-height: 150%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  color: rgba(51, 51, 51, 0.75);
}
.tutorial .modal-description-block {
  padding-top: 12px;
  padding-bottom: 8px;
}
.tutorial .description-title {
  font-family: Helvetica;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  line-height: 23px;
}
.tutorial .description-sentence {
  font-family: Helvetica;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 150%;
}
.tutorial.modal_box .modal_body {
  padding: 0 32px 10px;
}
.tutorial .modal-body {
  min-height: 440px;
  padding: 20px 40px 0;
}
.tutorial .modal-body.password, .tutorial .modal-body.set-occupation {
  margin: auto;
  padding: 0;
  width: 75%;
}
.tutorial .modal-body.password .modal-description, .tutorial .modal-body.set-occupation .modal-description {
  font-size: 16px;
  margin-bottom: 16px;
}
.tutorial .modal-body.password .field, .tutorial .modal-body.set-occupation .field {
  line-height: 2em;
  padding: 24px;
  margin-bottom: 40px;
  font-size: 16px;
  border: 1px solid #D5DADF;
  border-radius: 8px;
  text-align: left;
}
.tutorial .modal-body.password .field .input-area, .tutorial .modal-body.set-occupation .field .input-area {
  font-size: 14px;
  margin-bottom: 8px;
}
.tutorial .modal-body.password .field .input-area p, .tutorial .modal-body.set-occupation .field .input-area p {
  font-weight: bold;
  margin: 0px;
}
.tutorial .modal-body.password .field .input-area input[type=password], .tutorial .modal-body.set-occupation .field .input-area input[type=password] {
  width: 100%;
  padding: 13px;
  line-height: 1em;
  border: none;
  border-radius: 7px;
  background-color: #ECF0F5;
}
.tutorial .modal-body.password .field .input-area input[type=password]:focus, .tutorial .modal-body.set-occupation .field .input-area input[type=password]:focus {
  background-color: #FFFFFF;
  border: 4px solid #a2bde5;
  outline: none;
  padding: 9px;
}
.tutorial .modal-body.password .field .input-area input[type=password].error, .tutorial .modal-body.set-occupation .field .input-area input[type=password].error {
  background-color: #FFFFFF;
  border: 4px solid #e18888;
  padding: 9px;
}
.tutorial .modal-body.password .field .input-area input[type=password].error:focus, .tutorial .modal-body.set-occupation .field .input-area input[type=password].error:focus {
  outline: none;
}
.tutorial .modal-body.password .field .input-area .password_error, .tutorial .modal-body.set-occupation .field .input-area .password_error {
  color: #C61616;
  line-height: 1.6em;
}
.tutorial .modal-body.password .field .input-area select, .tutorial .modal-body.set-occupation .field .input-area select {
  width: 100%;
  padding: 13px;
  line-height: 1em;
  border: none;
  border-radius: 7px;
  background-color: #ECF0F5;
}
.tutorial .modal-body.password .field .button-area, .tutorial .modal-body.set-occupation .field .button-area {
  text-align: right;
}
.tutorial .modal-body.password .field .button-area.center, .tutorial .modal-body.set-occupation .field .button-area.center {
  text-align: center;
}
.tutorial .modal-body.password .field .button-area button, .tutorial .modal-body.set-occupation .field .button-area button {
  width: 120px;
  height: 40px;
  background-color: #4472BA;
  border: 1px solid #4472BA;
  color: #FFFFFF;
  padding: 8px 12px;
  border-radius: 4px;
  text-align: center;
  line-height: 1;
}
.tutorial .modal-body.password .field .button-area button.profile, .tutorial .modal-body.set-occupation .field .button-area button.profile {
  width: auto;
}
.tutorial .modal-body.password .field .button-area button .loading, .tutorial .modal-body.set-occupation .field .button-area button .loading {
  display: inline-block;
  width: 24px;
  height: 24px;
  border: 3px solid #FFFFFF;
  border-image: initial;
  border-radius: 50%;
  border-right-color: transparent;
  animation: rotation-frame 0.75s linear infinite;
}
.tutorial .modal-body.password .field .button-area button:active, .tutorial .modal-body.password .field .button-area button:focus, .tutorial .modal-body.set-occupation .field .button-area button:active, .tutorial .modal-body.set-occupation .field .button-area button:focus {
  outline: none;
}
.tutorial .modal-body.password .field .button-area button:disabled, .tutorial .modal-body.set-occupation .field .button-area button:disabled {
  opacity: 0.3;
}
.tutorial .modal-body.password .field .supplement, .tutorial .modal-body.set-occupation .field .supplement {
  line-height: 1.5em;
  font-size: 12px;
}
.tutorial .modal-body.sso-connect {
  margin: auto;
  padding: 0;
  width: 90%;
}
.tutorial .modal-body.sso-connect .modal-description {
  position: relative;
  display: flex;
}
.tutorial .modal-body.sso-connect .modal-description .text-area {
  position: absolute;
  margin-left: 360px;
  text-align: left;
  font-size: 16px;
  line-height: 1.6em;
}
.tutorial .modal-body.sso-connect .modal-description .text-area .detail-title {
  margin-bottom: 24px;
  margin-top: 8px;
  font-size: 20px;
  font-weight: bold;
}
.tutorial .modal-body .profile_image {
  width: 100px;
  margin: auto;
  border-radius: 50%;
}
.tutorial .modal-body .profile_image img {
  vertical-align: bottom;
  border-radius: 50%;
  border: solid 1px #CCC;
}
.tutorial .modal-content {
  background-color: #fff;
  background-repeat: no-repeat;
  width: 100%;
  max-height: 90rem;
  overflow: auto;
  height: auto;
}
.tutorial.modal_box .modal_footer {
  padding: 4px 32px 16px;
}
.tutorial .modal-footer {
  height: 120px;
  border: none;
  text-align: center;
  border-top: solid 1px #d1d1d1;
  padding-bottom: 40px;
  padding-left: 40px;
  padding-right: 40px;
}
.tutorial .modal-back {
  height: 100%;
  border-radius: 6px;
  background: rgba(246, 245, 245, 0.9);
}
.tutorial .qasee-logo {
  position: relative;
  bottom: 6px;
  right: 6px;
}
.tutorial .description-image {
  width: 90%;
  margin-top: 12px;
  margin-bottom: 12px;
}
.tutorial .occupation {
  font-family: Helvetica;
  font-style: normal;
  font-weight: bold;
  font-size: 32px;
  line-height: 37px;
  color: #094E8D;
}
.tutorial .install {
  color: #8A8A8A;
  opacity: 1;
}
.tutorial .install-description1 {
  color: #333333;
  font-size: 16px;
  line-height: 27px;
}
.tutorial .install-description2 {
  font-size: 14px;
  line-height: 20px;
  text-indent: -1em;
  margin-left: 16px;
}
.tutorial .step-table {
  font-size: 16px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 40px;
  text-align: center;
}
.tutorial .step-table tr {
  height: 52px;
}
.tutorial .step-table td {
  vertical-align: middle;
}
.tutorial .step {
  padding-right: 16px;
  font-weight: bold;
}
.tutorial .step-description {
  color: #333333;
  opacity: 1;
}
.tutorial .download-block {
  display: inline-block;
  margin-left: auto;
}
.tutorial .download-button-win {
  border-radius: 20px;
  background-color: #4A8EFF;
  width: 210px;
  height: 40px;
  border: none;
  font-size: 16px;
  margin-left: 16px;
  padding: 8px 16px;
  color: #FFF;
  display: flex;
  justify-content: center;
  align-items: center;
}
.tutorial .download-button-win:hover {
  opacity: 0.7;
}
.tutorial .download-button-mac {
  border-radius: 20px;
  background-color: #201715;
  width: 210px;
  height: 40px;
  border: none;
  font-size: 16px;
  margin-left: 16px;
  padding: 8px 16px;
  color: #FFF;
  display: flex;
  justify-content: center;
  align-items: center;
}
.tutorial .download-button-mac:hover {
  opacity: 0.7;
}
.tutorial .manual-link {
  color: #4A8EFF;
  font-size: 16px;
  padding: 8px 16px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.tutorial .download-icon {
  position: relative;
  margin-right: 4px;
}
.tutorial .manual-icon {
  position: relative;
  margin-right: 4px;
}
.tutorial .status-block {
  display: inline-block;
}
.tutorial .status {
  color: #8A8A8A;
  margin-right: 8px;
}
.tutorial .not-logged-in {
  color: #8A8A8A;
  opacity: 1;
}
.tutorial .logged-in {
  color: #333333;
  font-weight: bold;
}
.tutorial .check-mark {
  list-style-type: none;
  padding: 0 0 0 45px;
  position: relative;
  display: inline-block;
}
.tutorial .check-mark:before {
  content: " ";
  display: block;
  border: solid 14px #4A8EFF;
  border-radius: 32px;
  -moz-border-radius: 18px;
  -webkit-border-radius: 18px;
  height: 0;
  width: 0;
  position: absolute;
  left: 3px;
  top: 40%;
  margin-top: -22px;
}
.tutorial .check-mark:after {
  content: " ";
  display: block;
  width: 8px;
  height: 14px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  position: absolute;
  left: 13px;
  top: 40%;
  margin-top: -16px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.tutorial .disabled-check-mark {
  list-style-type: none;
  padding: 0 0 0 45px;
  position: relative;
  display: inline-block;
}
.tutorial .disabled-check-mark:before {
  content: " ";
  display: block;
  border: solid 14px #cccccc;
  border-radius: 32px;
  -moz-border-radius: 18px;
  -webkit-border-radius: 18px;
  height: 0;
  width: 0;
  position: absolute;
  left: 3px;
  top: 40%;
  margin-top: -22px;
}
.tutorial .disabled-check-mark:after {
  content: " ";
  display: block;
  width: 8px;
  height: 14px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  position: absolute;
  left: 13px;
  top: 40%;
  margin-top: -16px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* End tutorial-modal */
@charset "UTF-8";
.team-name {
  display: inline-block;
  margin-bottom: 0;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  border: 1px solid #999999;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  border-radius: 4px;
}

.nodata-comment {
  color: #c0c0c0;
}

/*

    労働時間、離席時間コンポーネント

*/
.time {
  margin: 50px 5% 0;
  display: flex;
  justify-content: space-around;
  align-items: flex-end;
  width: 90%;
  text-align: center;
  color: #333333;
}

.time .work-time {
  width: 140px;
  height: 70px;
  border-radius: 240px 240px 0 0;
  border: solid #4980E5 10px;
  border-bottom: none;
  margin: 10px 0;
}

.time .leave-time {
  width: 140px;
  height: 70px;
  border-radius: 240px 240px 0 0;
  border: solid #EC6A5E 10px;
  border-bottom: none;
  margin: 10px 0;
}

.time figcaption {
  transform: translateY(-40px);
  font-size: 18px;
  font-weight: 600;
}

.time p {
  margin: 0;
  padding: 0;
  color: #4F4F4F;
  font-size: 20px;
}

.time p strong {
  margin: 0;
  padding: 0;
  color: #5E6063;
  font-size: 30px;
  font-weight: 800;
}

/*

  コメントコンポーネント

*/
.comment {
  margin: 0.5vmax;
}

.comment p {
  margin-top: 1rem;
  line-height: 170%;
  background-color: #eef5ff;
  padding: 1.7rem;
  border-radius: 5px;
  color: #333333;
  width: 100%;
}

.comment span,
.comment p {
  font-size: 1em;
  font-weight: bold;
}

.content {
  position: relative;
}

#filter-content {
  position: absolute;
  right: 2%;
  display: none;
  z-index: 2;
  border-radius: 10px;
  background-color: #fff;
  padding: 15px;
  width: 30%;
  box-shadow: 0 0 8px gray;
}

#filter-content #no-data-message {
  color: red;
  border-bottom: none;
  font-weight: normal;
}

.content #filter-content p {
  margin-bottom: 0;
  margin-top: 10px;
  font-weight: 700;
  border-bottom: solid 1px #ddd;
}

.content #filter-content svg {
  margin-right: 2px;
}

#check-box-data-presence label {
  margin-top: 5px;
  font-weight: normal;
}

#check-boxes {
  display: inline-block;
}

#check-boxes label {
  margin: 5px 5px 5px auto;
  font-weight: normal;
}

#button-area {
  margin-top: 20px;
}

#button-area button {
  height: 34px;
}

#no-result-message {
  color: #9D9A94;
  text-align: center;
  margin: 15% auto 50% auto;
}

#no-result-message i {
  margin-right: 1%;
}
/* Start general introduction */
.introduction {
  max-height: 100%;
  overflow-y: auto;
}
.introduction h1 {
  font-size: 36px;
}
.introduction h3 {
  margin-top: 20px;
  margin-bottom: 10px;
  font-size: 24px;
}
.introduction h4 {
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 18px;
}
.introduction .intro-title {
  margin-top: 30px;
  color: #4a7ecd;
  font-weight: 700;
  text-align: center;
}
.introduction .intro-content {
  background-color: #f7f6f6;
}
.introduction .info-detail {
  margin-left: 40px;
}
.introduction .graph {
  margin-bottom: 10px;
  color: #4a7ecd;
  font-size: 2rem;
  font-weight: 700;
}
.introduction .graph-detail {
  margin-left: 20px;
}
.introduction .info-up {
  color: #4a7ecd;
  font-size: 2rem;
  font-weight: 700;
}
.introduction .info-down {
  color: #4a7ecd;
  font-size: 2rem;
  font-weight: 700;
  margin-left: 30px;
}
.introduction .intro-sample {
  font-size: 1.8rem;
  color: #878c9a;
  font-weight: 600;
}
.introduction .intro-description {
  margin: auto 30px auto 30px;
}
.introduction .sample-image {
  margin: 10px auto 30px auto;
}
.introduction .introduction-footer input, .introduction .introduction-footer button {
  width: 20%;
  height: 50px;
  margin: 10px auto 20px 30px;
  font-size: 20px;
}

/* end general introduction */
/* Start dashboard_introduction */
#modal-dashboard-introduction .intro-sample {
  margin-top: 30px;
}

/* End dashboard_introduction */
/* Start report_introduction */
#modal-team-report-introduction1 .intro-sample,
#modal-team-report-introduction2 .intro-sample,
#modal-member-report-introduction1 .intro-sample,
#modal-member-report-introduction2 .intro-sample {
  color: #747475;
  margin-top: 50px;
}

/*End report_introduction */
/*Start search_introduction */
#modal-search-introduction1 .intro-sample {
  color: #747475;
  margin-top: 50px;
}

#modal-search-introduction3 .search-arrow {
  font-size: 60px;
  color: #4a7ecd;
}

/*End search_introduction*/
.login_wrapper,
.single_wrapper {
  width: 500px;
  margin: 0 auto;
  padding: 120px 0 0;
}
.login_wrapper p,
.single_wrapper p {
  margin: 0 0 10px;
}
.login_wrapper a,
.single_wrapper a {
  color: #337ab7;
  text-decoration: none;
}
.login_wrapper a:focus, .login_wrapper a:hover,
.single_wrapper a:focus,
.single_wrapper a:hover {
  color: #23527c;
  text-decoration: underline;
  outline: 0;
}
.login_wrapper hr,
.single_wrapper hr {
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid #eee;
}
.login_wrapper .input_area,
.single_wrapper .input_area {
  margin-bottom: 40px;
}
.login_wrapper .input_area input,
.single_wrapper .input_area input {
  padding: 6px 20px;
}
.login_wrapper button,
.single_wrapper button {
  display: block;
  width: 100%;
  min-height: 41px;
  margin-bottom: 16px;
  border-radius: 4px;
  padding: 6px 12px;
  text-align: center;
}
.login_wrapper button.login_button,
.single_wrapper button.login_button {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
  border: 1px solid transparent;
}
.login_wrapper .success,
.single_wrapper .success {
  margin: 20px;
  padding: 20px;
  background-color: #e6f4ed;
  display: flex;
  border-radius: 4px;
}
.login_wrapper .success .icon,
.single_wrapper .success .icon {
  margin-right: 8px;
  color: #0D9554;
}
.login_wrapper .success .success_text,
.single_wrapper .success .success_text {
  width: 100%;
  -ms-word-wrap: break-word;
  word-wrap: break-word;
}
.login_wrapper .form-control,
.single_wrapper .form-control {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 20px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
}
.login_wrapper .form-group,
.single_wrapper .form-group {
  margin-bottom: 15px;
}

.sign_in_title {
  text-align: center;
  font-size: 24px;
  margin-bottom: 20px;
}

.login_info {
  text-align: center;
  margin-top: 32px;
}
.login_info .textarea {
  display: inline-block;
  padding: 0 4px;
  border-bottom: 1px dashed #333333;
}
.login_info .textarea span {
  margin-right: 8px;
}

.login-logo,
.register-logo {
  font-size: 35px;
  text-align: center;
  margin-bottom: 25px;
  font-weight: 300;
}

.login-logo a,
.register-logo a {
  color: #444;
}

.login-box,
.register-box {
  width: 360px;
  margin: 7% auto;
}

@media (max-width: 768px) {
  .register-box {
    width: 90%;
    margin-top: 20px;
  }
}
.login-box-body,
.register-box-body {
  padding: 20px;
  border-top: 0;
  color: #666;
}

.login-box-body .form-control-feedback,
.register-box-body .form-control-feedback {
  color: #777;
}

.login-box-msg,
.register-box-msg {
  margin: 0;
  text-align: center;
  padding: 0 20px 20px 20px;
}

.sso-microsoft {
  display: block;
  background-color: #FFFFFF;
  border: 1px solid #5E5E5E;
  color: #5E5E5E;
  padding: 12px 24px;
  min-height: 41px;
  margin-bottom: 16px;
  border-radius: 4px;
}
.sso-microsoft:hover {
  color: #5E5E5E;
  background-color: #ECF0F5;
}
.sso-microsoft:focus, .sso-microsoft:active {
  outline: 0;
}
.sso-microsoft img {
  margin-right: 24px;
}

.sso-google {
  display: block;
  background-color: #FFFFFF;
  border: 1px solid #4285F4;
  color: #4285F4;
  padding: 12px 24px;
  min-height: 41px;
  margin-bottom: 16px;
  border-radius: 4px;
}
.sso-google:hover {
  color: #4285F4;
  background-color: #ECF0F5;
}
.sso-google:focus, .sso-google:active {
  outline: 0;
}
.sso-google img {
  margin-right: 24px;
}

.sso-cybozu {
  display: block;
  background-color: #FFFFFF;
  border: 1px solid #039;
  color: #039;
  padding: 12px 24px;
  min-height: 41px;
  margin-bottom: 16px;
  border-radius: 4px;
}
.sso-cybozu:hover {
  color: #039;
  background-color: #ECF0F5;
}
.sso-cybozu:focus, .sso-cybozu:active {
  outline: 0;
}
.sso-cybozu img {
  margin-right: 24px;
}

.sso_error {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  min-height: 100px;
  padding: 20px 0;
  text-align: center;
  background-color: #f9e7e7;
}
.sso_error .error_title {
  color: #C61616;
  font-weight: bold;
}
.sso_error .error_title span {
  margin-left: 4px;
}
.sso_error button {
  position: absolute;
  top: 4px;
  right: 4px;
  border: none;
  background-color: transparent;
}
/*! destyle.css v3.0.2 | MIT License | https://github.com/nicolas-cusan/destyle.css */
/* Reset box-model and set borders */
/* ============================================ */
*,
::before,
::after {
  box-sizing: border-box;
  border-style: solid;
  border-width: 0;
}

/* Document */
/* ============================================ */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 * 3. Remove gray overlay on links for iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -webkit-tap-highlight-color: transparent;
  /* 3*/
}

/* Sections */
/* ============================================ */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/* Vertical rhythm */
/* ============================================ */
p,
table,
blockquote,
address,
pre,
iframe,
form,
figure,
dl {
  margin: 0;
}

/* Headings */
/* ============================================ */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
}

/* Lists (enumeration) */
/* ============================================ */
ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Lists (definition) */
/* ============================================ */
dt {
  font-weight: bold;
}

dd {
  margin-left: 0;
}

/* Grouping content */
/* ============================================ */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
  border-top-width: 1px;
  margin: 0;
  clear: both;
  color: inherit;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: inherit;
  /* 2 */
}

address {
  font-style: inherit;
}

/* Text-level semantics */
/* ============================================ */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
  text-decoration: none;
  color: inherit;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  text-decoration: underline dotted;
  /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: inherit;
  /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Replaced content */
/* ============================================ */
/**
 * Prevent vertical alignment issues.
 */
svg,
img,
embed,
object,
iframe {
  vertical-align: bottom;
}

/* Forms */
/* ============================================ */
/**
 * Reset form fields to make them styleable.
 * 1. Make form elements stylable across systems iOS especially.
 * 2. Inherit text-transform from parent.
 */
button,
input,
optgroup,
select,
textarea {
  -webkit-appearance: none;
  /* 1 */
  appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  background: transparent;
  padding: 0;
  margin: 0;
  border-radius: 0;
  text-align: inherit;
  text-transform: inherit;
  /* 2 */
}

/**
 * Reset radio and checkbox appearance to preserve their look in iOS.
 */
[type=checkbox] {
  -webkit-appearance: checkbox;
  appearance: checkbox;
}

[type=radio] {
  -webkit-appearance: radio;
  appearance: radio;
}

/**
 * Correct cursors for clickable elements.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  cursor: pointer;
}

button:disabled,
[type=button]:disabled,
[type=reset]:disabled,
[type=submit]:disabled {
  cursor: default;
}

/**
 * Improve outlines for Firefox and unify style with input elements & buttons.
 */
:-moz-focusring {
  outline: auto;
}

select:disabled {
  opacity: inherit;
}

/**
 * Remove padding
 */
option {
  padding: 0;
}

/**
 * Reset to invisible
 */
fieldset {
  margin: 0;
  padding: 0;
  min-width: 0;
}

legend {
  padding: 0;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the outline style in Safari.
 */
[type=search] {
  outline-offset: -2px;
  /* 1 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Fix font inheritance.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/**
 * Clickable labels
 */
label[for] {
  cursor: pointer;
}

/* Interactive */
/* ============================================ */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/*
 * Remove outline for editable content.
 */
[contenteditable]:focus {
  outline: auto;
}

/* Tables */
/* ============================================ */
/**
1. Correct table border color inheritance in all Chrome and Safari.
*/
table {
  border-color: inherit;
  /* 1 */
  border-collapse: collapse;
}

caption {
  text-align: left;
}

td,
th {
  vertical-align: top;
  padding: 0;
}

th {
  text-align: left;
  font-weight: bold;
}
@charset "UTF-8";
:root {
  --color: 240, 240, 240;
  --alpha: 0.2;
}

html {
  font-size: 12px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

button {
  padding: 8px 12px;
}
button:disabled {
  color: #999999;
  cursor: not-allowed;
}
button:hover {
  opacity: 0.8;
}

a {
  color: #337ab7;
  text-decoration: none;
}

p {
  margin: 0 0 10px;
}

.form-error {
  color: #FF0000;
}

.mb8 {
  margin-bottom: 8px;
}

.chip {
  background-color: #eeeeee;
  padding: 4px 8px;
  border-radius: 12px;
  margin: 0px 4px;
  display: flex;
  align-items: center;
  gap: 4px;
}

input[type=text],
input[type=number] {
  border: solid 1px #999;
  background-color: #FFF;
  border-radius: 3px;
  padding: 6px 8px;
}
input[type=text]:disabled,
input[type=number]:disabled {
  border: solid 1px #CCC;
  background-color: #F8F8F8;
}
input[type=text]:focus,
input[type=number]:focus {
  outline: none;
}
input[type=text].no_border,
input[type=number].no_border {
  border: none;
}

select:focus {
  outline: none;
}

.select {
  background-color: #EEEEEE;
  border-radius: 5px;
  position: relative;
  z-index: 1;
}
.select::after {
  position: absolute;
  content: "";
  width: 8px;
  height: 8px;
  right: 10px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  border-bottom: 2px solid #666;
  border-right: 2px solid #666;
  z-index: -1;
}
.select select {
  width: 100%;
  padding: 6px 12px;
  border-radius: 4px;
  border: none;
  min-height: 40px;
  margin-right: 12px;
}
.select select:focus {
  outline: none;
}

.search_box,
.search_area {
  position: relative;
}
.search_box input[type=text],
.search_area input[type=text] {
  padding: 8px 28px 8px 8px;
  width: 250px;
  border: 1px solid #CCCCCC;
  background-color: #FFF;
}
.search_box input[type=text]::placeholder,
.search_area input[type=text]::placeholder {
  color: #999999;
}
.search_box input[type=text]:focus,
.search_area input[type=text]:focus {
  outline: none;
}
.search_box input[type=text]::-ms-clear,
.search_area input[type=text]::-ms-clear {
  visibility: hidden;
}
.search_box .reset,
.search_area .reset {
  display: inline-flex;
  position: absolute;
  top: 50%;
  right: 0;
  font-size: 16px;
  border: none;
  background-color: transparent;
  color: #CCCCCC;
  transform: translateY(-50%);
}
.search_box .reset:hover,
.search_area .reset:hover {
  color: #333333;
}
.search_box .reset:focus,
.search_area .reset:focus {
  outline: none;
}
.search_box.label_select .bottom_area,
.search_area.label_select .bottom_area {
  background-color: #FAFAFA;
  width: 93%;
  position: fixed;
  bottom: 60px;
  display: flex;
  justify-content: center;
  padding: 8px;
}
.search_box.label_select .bottom_area button,
.search_area.label_select .bottom_area button {
  border: solid 1px #999999;
  border-radius: 4px;
  width: 200px;
  text-align: center;
  background-color: #e9ffe6;
}
.search_box.label_select .bottom_area button:hover,
.search_area.label_select .bottom_area button:hover {
  opacity: 0.8;
}

.modal_open {
  overflow: hidden;
}

.header {
  position: fixed;
  width: 100%;
  height: 50px;
  background: #FFFFFF;
  padding: 0 48px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 2002;
}
.header .logo img {
  height: 30px;
}
.header .info_bar {
  width: 600px;
  padding: 8px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.header .tools {
  display: flex;
  align-items: center;
  margin-right: 120px;
  gap: 16px;
}
.header .tools .video {
  position: relative;
}
.header .tools .video .icon {
  background-color: #ECF0F5;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  cursor: pointer;
}
.header .tools .video .dropdown {
  width: 400px;
  position: absolute;
  top: 40px;
  right: 1px;
  left: auto;
  border-radius: 8px;
  padding: 8px;
  background-color: #FFF;
  font-size: 14px;
  box-shadow: 0 0px 4px #ccc;
  z-index: 2010;
}
.header .tools .video .dropdown .title {
  text-align: center;
  font-weight: bold;
  background-color: #ECF0F4;
  padding: 10px;
}
.header .tools .notice {
  position: relative;
}
.header .tools .notice .icon {
  background-color: #ECF0F5;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.header .tools .notice .dropdown {
  min-width: 230px;
  width: max-content;
  position: absolute;
  top: 40px;
  right: 1px;
  left: auto;
  border-radius: 8px;
  padding: 8px;
  background-color: #FFF;
  font-size: 14px;
  box-shadow: 0 0px 4px #ccc;
  z-index: 2010;
}
.header .tools .notice .dropdown .title {
  text-align: center;
  font-weight: bold;
  background-color: #ECF0F4;
  padding: 10px;
}
.header .tools .notice .dropdown li.item {
  display: flex;
  align-items: center;
  padding: 12px 8px 8px;
  border-bottom: 1px dashed #92999E;
  cursor: pointer;
  position: relative;
}
.header .tools .notice .dropdown li.item .external {
  font-size: 10px;
}
.header .tools .notice .dropdown li.item.center {
  margin-top: 10px;
  justify-content: center;
}
.header .tools .notice .dropdown li.item:last-of-type {
  border-bottom: none;
}
.header .tools .notice .dropdown li.item .new {
  margin-left: 8px;
  padding: 2px 4px;
  background-color: #FF0000;
  color: #FFF;
  font-size: 10px;
}
.header .tools .profile {
  position: relative;
}
.header .tools .profile .display {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.header .tools .profile .display .icon {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  margin-right: 8px;
}
.header .tools .profile .display .name {
  font-size: 12px;
}
.header .tools .profile .dropdown {
  min-width: 230px;
  width: max-content;
  position: absolute;
  top: 40px;
  right: 1px;
  left: auto;
  border-radius: 8px;
  padding: 8px;
  background-color: #FFF;
  font-size: 14px;
  box-shadow: 0 0px 4px #ccc;
  z-index: 2010;
}
.header .tools .profile .dropdown .hidden {
  display: none;
}
.header .tools .profile .dropdown .title {
  display: flex;
  align-items: center;
  height: auto;
  background-color: #ECF0F5;
  padding: 10px;
  font-size: 16px;
}
.header .tools .profile .dropdown .title .set_image {
  margin-right: 16px;
}
.header .tools .profile .dropdown .title .set_image .hover_filter {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: black;
  position: absolute;
  opacity: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.header .tools .profile .dropdown .title .set_image .hover_filter svg path {
  fill: #FFF;
}
.header .tools .profile .dropdown .title .set_image .hover_filter:hover {
  opacity: 0.5;
}
.header .tools .profile .dropdown .title .set_image .icon {
  border-radius: 50%;
  width: 50px;
  height: 50px;
}
.header .tools .profile .dropdown .title p {
  margin: 0;
}
.header .tools .profile .dropdown li.item {
  display: flex;
  align-items: center;
  padding: 12px 8px 8px;
  border-bottom: 1px dashed #92999E;
  cursor: pointer;
  position: relative;
}
.header .tools .profile .dropdown li.item .external {
  font-size: 10px;
}
.header .tools .profile .dropdown li.item a {
  display: flex;
  align-items: center;
}
.header .tools .profile .dropdown li.item .icon {
  margin-right: 8px;
}
.header .tools .profile .dropdown li.item.center {
  margin-top: 10px;
  justify-content: center;
}
.header .tools .profile .dropdown li.item:last-of-type {
  border-bottom: none;
}

.side {
  position: fixed;
  width: 80px;
  height: 100vh;
  background-color: #4372BA;
  color: #FFF;
  z-index: 2000;
  padding-top: 16px;
}
.side .help {
  position: relative;
}
.side .lock {
  height: 50px;
  border-radius: 6px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 17px;
  position: absolute;
  background-color: #4472ba;
  margin: 0 8px 4px;
  z-index: 1;
  opacity: 0.7;
  cursor: pointer;
}
.side .lock .lock_icon {
  width: 30px;
  height: 30px;
}
.side .tip_wrap {
  position: absolute;
  left: 105%;
  top: 50%;
  transform: translateY(-50%) translateX(0%);
  background-color: #FFFFFF;
  color: #666666;
  padding: 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: initial;
  border: solid 1px #666666;
}
.side .tip_wrap .tip {
  position: relative;
  white-space: nowrap;
  display: flex;
  gap: 4px;
}
.side .tip_wrap .tip::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #FFFFFF;
  position: absolute;
  bottom: 0;
  left: -10px;
  margin: auto;
  transform: rotate(45deg) translateX(-50%);
  z-index: 0;
  border-bottom: solid 1px #666666;
  border-left: solid 1px #666666;
}
.side .item {
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 16px;
  color: #FFF;
  margin-bottom: 4px;
  flex-flow: column;
  font-size: 12px;
  white-space: nowrap;
  position: relative;
}
.side .item .attention {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #eb3333;
  position: absolute;
  top: 4px;
  right: 12px;
}
.side .item .text {
  display: flex;
  margin-top: 4px;
}
.side .item:hover .tip {
  display: flex;
  align-items: baseline;
}
.side .item .icon {
  fill: #FFF;
  width: 24px;
  height: 24px;
}
.side .item .icon use {
  fill: #FFF;
}
.side .item:not(.no_change):hover, .side .item.active {
  background-color: #ECF0F4;
  color: #4372BA;
  margin: 0 8px 4px;
  padding: 0 8px;
  border-radius: 6px;
}
.side .item:not(.no_change):hover .external, .side .item.active .external {
  color: #4372BA;
}
.side .item:not(.no_change):hover .icon, .side .item.active .icon {
  fill: #4372BA;
}
.side .item:not(.no_change):hover .icon use, .side .item.active .icon use {
  fill: #4372BA;
}
.side .item:not(.no_change):hover .attention, .side .item.active .attention {
  right: 4px;
}
.side .section_title {
  padding: 8px;
  margin-top: 40px;
  display: none;
  cursor: pointer;
  position: relative;
}
.side .section_title .tw {
  display: none;
  position: absolute;
  background-color: #333;
  left: 8px;
  top: -26px;
  width: max-content;
  padding: 8px;
  border-radius: 4px;
  font-size: 10px;
  opacity: 0.8;
}
.side .section_title:hover .tw {
  display: block;
}
.side .separator {
  background-color: #FFFFFF;
  width: 60%;
  height: 1px;
  margin: 16px auto;
}
.side .prev_version {
  position: absolute;
  bottom: 60px;
  color: #cbddf9;
  left: 0px;
  right: 0px;
  text-align: center;
  font-size: 12px;
  cursor: pointer;
}
.side .prev_version .external {
  margin-right: 0;
}
.side .prev_version span {
  display: none;
}
.side.open .tip {
  display: flex;
  position: relative;
  color: inherit;
  border: none;
  background-color: transparent;
  transform: none;
  font-size: inherit;
  white-space: nowrap;
  align-items: center;
}
.side.open .tip .external {
  color: inherit;
}

.side_sub_wrap {
  position: fixed;
  height: 100vh;
  width: 0px;
  z-index: 1999;
}
.side_sub_wrap .side_sub {
  position: fixed;
  left: 80px;
  width: 5px;
  height: calc(100vh - 50px);
  background-color: #395F99;
  padding: 0px;
  overflow-y: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.side_sub_wrap .side_sub::-webkit-scrollbar {
  display: none;
}
.side_sub_wrap .side_sub .item {
  display: none;
  align-items: center;
  border-radius: 4px;
  margin-bottom: 8px;
  margin-left: 0px;
  position: relative;
  cursor: pointer;
  color: #FFF;
}
.side_sub_wrap .side_sub .item.member, .side_sub_wrap .side_sub .item.indent_1 {
  margin-left: 8px;
}
.side_sub_wrap .side_sub .item.indent_2 {
  margin-left: 16px;
}
.side_sub_wrap .side_sub .item.indent_3 {
  margin-left: 24px;
}
.side_sub_wrap .side_sub .item.folder {
  background-color: #507dc0;
}
.side_sub_wrap .side_sub .item .arrow_icon {
  transition: transform 0.3s ease;
}
.side_sub_wrap .side_sub .item .arrow_icon.open {
  transform: rotate(180deg);
}
.side_sub_wrap .side_sub .item label,
.side_sub_wrap .side_sub .item .name_label {
  padding: 8px;
  display: flex;
  align-items: center;
  justify-content: left;
  gap: 8px;
  width: 100%;
}
.side_sub_wrap .side_sub .item label .icon,
.side_sub_wrap .side_sub .item .name_label .icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  margin-right: 8px;
  fill: #FFF;
}
.side_sub_wrap .side_sub .item label .icon.task,
.side_sub_wrap .side_sub .item .name_label .icon.task {
  width: 18px;
  height: 18px;
  margin: 3px 8px 3px 0;
}
.side_sub_wrap .side_sub .item label .name_area,
.side_sub_wrap .side_sub .item .name_label .name_area {
  display: flex;
  align-items: center;
  position: relative;
}
.side_sub_wrap .side_sub .item label .name_area .attention,
.side_sub_wrap .side_sub .item .name_label .name_area .attention {
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #eb3333;
  right: -16px;
}
.side_sub_wrap .side_sub .item .tip {
  display: none;
  position: absolute;
  background-color: #FFF;
  color: #666;
  font-size: 12px;
  border: solid 1px #CCC;
  right: 0px;
  top: 0px;
  padding: 4px;
  width: max-content;
  transform: translateY(14px) translateX(60px);
}
.side_sub_wrap .side_sub .item .tip .external {
  color: #666;
  width: 10px;
  height: 10px;
  margin-left: 8px;
}
.side_sub_wrap .side_sub .item .tip p {
  margin: 0;
  padding: 8px;
}
.side_sub_wrap .side_sub .item:hover .tip {
  display: flex;
  align-items: baseline;
  flex-flow: column;
}
.side_sub_wrap .side_sub .item:not(.toggle):not(.folder):hover, .side_sub_wrap .side_sub .item.active {
  background-color: #ECF0F4;
  color: #4372BA;
}
.side_sub_wrap .side_sub .item:not(.toggle):not(.folder):hover .external, .side_sub_wrap .side_sub .item.active .external {
  color: #4372BA;
}
.side_sub_wrap .side_sub .item:not(.toggle):not(.folder):hover .icon, .side_sub_wrap .side_sub .item.active .icon {
  fill: #4372BA;
}
.side_sub_wrap .side_sub .item:not(.toggle):not(.folder):hover .icon use, .side_sub_wrap .side_sub .item.active .icon use {
  fill: #4372BA;
}
.side_sub_wrap .side_sub .toggle {
  display: none;
}
.side_sub_wrap .side_sub .toggle + div {
  max-height: 0px;
  opacity: 0;
  height: auto;
  display: none;
}
.side_sub_wrap .side_sub .toggle + div .item {
  display: none;
}
.side_sub_wrap .side_sub .toggle:checked + div {
  opacity: 1;
  max-height: 9999px;
  display: block;
}
.side_sub_wrap .side_sub .toggle:checked + div .item {
  display: flex;
}
.side_sub_wrap .side_sub .section_title {
  padding: 8px;
  margin-top: 40px;
  display: none;
  cursor: pointer;
  position: relative;
}
.side_sub_wrap .side_sub .section_title .tw {
  display: none;
  position: absolute;
  background-color: #333;
  left: 8px;
  top: -26px;
  width: max-content;
  padding: 8px;
  border-radius: 4px;
  font-size: 10px;
  opacity: 0.8;
}
.side_sub_wrap .side_sub .section_title:hover .tw {
  display: block;
}
.side_sub_wrap .side_sub .separator {
  background-color: #FFFFFF;
  width: 60%;
  height: 1px;
  margin: 16px auto;
}
.side_sub_wrap .side_sub_tip {
  display: none;
  position: absolute;
  background-color: #FFF;
  color: #666;
  font-size: 12px;
  border: solid 1px #CCC;
  border-radius: 4px;
  padding: 4px;
  width: max-content;
  min-width: 210px;
  z-index: 1;
  box-shadow: 0px 0px 6px #64646466;
}
.side_sub_wrap .side_sub_tip.display {
  display: block;
}
.side_sub_wrap .side_sub_tip .title {
  font-weight: bold;
  padding: 4px;
}
.side_sub_wrap .side_sub_tip .link {
  margin: 0;
  padding: 8px;
}
.side_sub_wrap .side_sub_tip .report_list_row {
  width: 100%;
  padding: 8px 8px 8px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 30px;
  cursor: pointer;
}
.side_sub_wrap .side_sub_tip .report_list_row .text {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 90%;
}
.side_sub_wrap .side_sub_tip .report_list_row .icon {
  display: none;
}
.side_sub_wrap .side_sub_tip .report_list_row .new {
  background-color: #ff4560;
  color: white;
  font-size: 10px;
  padding: 2px 4px;
  border-radius: 4px;
}
.side_sub_wrap .side_sub_tip .report_list_row:hover {
  background-color: #ECF0F5;
}
.side_sub_wrap .side_sub_tip .report_list_row:hover .icon {
  display: block;
}
.side_sub_wrap .side_sub_tip .no_contents {
  padding: 8px;
}
.side_sub_wrap .calendar_box {
  top: 60px;
  left: 77px;
  right: unset;
}
.side_sub_wrap .calendar_text .button {
  display: none;
  margin: 0;
  width: 70%;
  height: 40px;
  background-color: transparent;
  color: #FFF;
  text-align: center;
}
.side_sub_wrap .calendar_text .button.display {
  display: block;
  padding: 8px;
  font-size: 14px;
}
.side_sub_wrap .calendar_text .menu_toggle {
  background-color: #395F99;
  width: 20px;
  height: 70px;
  border-radius: 0 4px 4px 0;
  margin-top: 20px;
  margin-left: 5px;
  color: #FFF;
  font-size: 20px;
}
.side_sub_wrap .calendar_text .menu_toggle.display {
  display: block;
  width: 40px;
  height: auto;
  margin: 0;
}
.side_sub_wrap .calendar_text .menu {
  position: relative;
  transform: rotate(180deg);
  margin-left: 8px;
}
.side_sub_wrap .calendar_text .menu.active {
  transform: rotate(0deg);
}
.side_sub_wrap .tools {
  position: fixed;
  width: 0px;
  top: 50px;
  left: 80px;
  z-index: 1;
  background-color: #395F99;
  padding: 0px;
}
.side_sub_wrap .setting {
  color: #FFF;
}
.side_sub_wrap .setting .setting_menu {
  text-align: right;
}
.side_sub_wrap .setting .setting_type {
  font-size: 14px;
  margin-bottom: 8px;
}
.side_sub_wrap .setting .setting_label {
  padding: 12px 8px;
  margin: 4px 0;
  border-radius: 4px;
  background-color: #FFF;
  color: #4472BA;
  display: none;
}
.side_sub_wrap .setting .setting_label.active {
  display: flex;
  justify-content: space-between;
}
.side_sub_wrap .setting .setting_label.open {
  background-color: #4472BA;
  color: #FFF;
}
.side_sub_wrap .setting .setting_item {
  margin-left: 8px;
  padding: 12px 0;
}
.side_sub_wrap .setting .arrow_icon {
  margin-left: 8px;
  transition: transform 0.3s ease;
}
.side_sub_wrap .setting .arrow_icon.open {
  transform: rotate(180deg);
}
.side_sub_wrap .setting .icon {
  width: 24px;
  margin-right: 8px;
  cursor: pointer;
}
.side_sub_wrap .setting .setting_toggle {
  background-color: #395F99;
  width: 20px;
  height: 70px;
  border-radius: 0 4px 4px 0;
  margin-top: 20px;
  margin-left: 5px;
  color: #FFF;
  font-size: 20px;
}
.side_sub_wrap .setting .setting_toggle.display {
  width: 40px;
  height: auto;
  margin: 0;
}
.side_sub_wrap .setting .menu {
  position: relative;
  transform: rotate(180deg);
  margin-left: 8px;
}
.side_sub_wrap .setting .menu.active {
  transform: rotate(0deg);
}

.main {
  padding: 40px 3% 40px calc(4% + 80px);
  background-color: #ECF0F4;
  min-height: calc(100vh - 50px);
  transition: all 0.3s;
  zoom: 97%;
}
.main .info_bar {
  position: absolute;
  top: 50px;
  left: 0;
  width: 100%;
  margin: auto;
  padding: 8px 8px 8px calc(4% + 80px);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  transition: all 0.3s;
}

.sticky_header {
  display: none;
  background-color: rgba(255, 255, 255, 0.95);
  position: fixed;
  top: 50px;
  left: 80px;
  padding: 16px 64px;
  width: calc(100% - 80px);
  z-index: 1010;
  border-bottom: solid 1px #CCC;
}
.sticky_header.active {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.sticky_header .condition_area {
  display: flex;
  align-items: center;
  flex-flow: wrap;
  gap: 4px;
}
.sticky_header .bread_area {
  padding: 0px 0px 8px;
}
.sticky_header .title_area {
  font-size: 22px;
}
.sticky_header .items {
  display: flex;
}
.sticky_header .items .item {
  margin: 0px 8px;
  text-align: center;
  min-width: 60px;
}
.sticky_header .items .item img {
  width: 40px;
  height: 40px;
  margin: auto;
}
.sticky_header .items .item .text_area {
  width: 40px;
  height: 40px;
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
  font-size: 16px;
}
.sticky_header .items .item .item_title {
  margin-top: 4px;
  font-size: 12px;
}
.sticky_header .items .item .item_title div {
  width: 80px;
  font-size: 10px;
  color: #FFFFFF;
  background-color: #777777;
  padding: 4px 0;
  margin: 0 auto 4px;
}
.sticky_header .mb8 {
  display: flex;
  align-items: center;
}

.fixed_box {
  position: fixed;
  width: calc(100% - 85px);
  bottom: 0px;
  left: 85px;
  background-color: #f5f5f5;
  padding: 24px 64px;
  z-index: 2000;
  border: 1px solid #bfbfbf;
  zoom: 103%;
}

.fixed_box_min {
  position: fixed;
  width: auto;
  bottom: 20px;
  left: 85px;
  background-color: #ffffff;
  padding: 16px 64px;
  z-index: 2000;
  border: 1px solid #bfbfbf;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
}

.bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  display: none;
}
.bg.excellent {
  background-image: url("/static/images/bg/excellent_bg.png");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100%;
  opacity: 0;
  -webkit-animation: anime 9s 0s 1;
  animation: anime 9s 0s 1;
  display: block;
}

.bg-primary {
  color: #fff;
  background-color: #337ab7;
}

.bg-success {
  background-color: #dff0d8;
}

.bg-info {
  background-color: #d9edf7;
}

.bg-warning {
  background-color: #fcf8e3;
}

.bg-danger {
  background-color: #f2dede;
}

@keyframes anime {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  10% {
    opacity: 0.9;
    transform: scale(1);
  }
  70% {
    opacity: 0.9;
  }
  100% {
    opacity: 0;
    transform: scale(1.15);
  }
}
.wrapper {
  height: 100vh;
  padding-top: 50px;
}
.wrapper.open .side_sub_wrap .side_sub {
  width: 220px;
  padding: 80px 8px 16px 16px;
}
.wrapper.open .side_sub_wrap .side_sub .item {
  display: flex;
}
.wrapper.open .side_sub_wrap .tools {
  width: 220px;
  padding: 16px;
}
.wrapper.open .main {
  padding: 40px 3% 40px calc(4% + 300px);
  transition: all 0.3s;
}
.wrapper.open .main .info_bar {
  padding: 8px 8px 8px calc(4% + 300px);
}
.wrapper.open .sticky_header {
  left: 300px;
  padding: 16px 40px;
  width: calc(100% - 300px);
}
.wrapper.open .fixed_box {
  left: 300px;
  width: calc(100% - 300px);
}
.wrapper.open .fixed_box_min {
  left: 300px;
}
.wrapper.gone .main {
  padding: 40px 3%;
}

.breadcrumb {
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  position: relative;
}
.breadcrumb .item {
  display: flex;
}
.breadcrumb .item:not(:last-child)::after {
  content: ">";
  display: block;
  margin: 0 8px;
}

.page_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 40px;
}
.page_header h1 {
  font-size: 28px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.page_header h1.question {
  display: flex;
  align-items: center;
}
.page_header h1.question .icon_question {
  cursor: pointer;
}
.page_header h1.question .icon_question svg {
  display: flex;
  width: 20px;
}
.page_header h1.question .icon_question:hover {
  fill: #FFFFFF;
}
.page_header h1.question .period {
  font-size: 16px;
}
.page_header h1.question .period::before {
  content: "(";
}
.page_header h1.question .period::after {
  content: ")";
}
.page_header h1 .icon {
  background-color: #ffffff;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  cursor: pointer;
}
.page_header .title {
  font-size: 30px;
  color: #666666;
}
.page_header .tools {
  display: flex;
  align-items: center;
  position: relative;
  gap: 8px;
}
.page_header .download_csv_area,
.page_header .download_pdf_area {
  font-size: 12px;
  position: relative;
  display: flex;
  justify-content: flex-end;
}
.page_header .download_csv_area button,
.page_header .download_pdf_area button {
  display: inline-block;
  border: 1px solid #4472ba;
  border-radius: 4px;
  padding: 7px 16px;
}
.page_header .download_csv_area button.toggle,
.page_header .download_pdf_area button.toggle {
  align-items: center;
  background-color: rgba(68, 114, 186, 0.1);
  color: #4472BA;
  display: flex;
  gap: 4px;
}
.page_header .download_csv_area button.toggle .icon,
.page_header .download_pdf_area button.toggle .icon {
  height: 24px;
  width: 24px;
}
.page_header .download_csv_area button.toggle svg g,
.page_header .download_pdf_area button.toggle svg g {
  fill: #4472BA;
}
.page_header .download_csv_area button.toggle:hover,
.page_header .download_pdf_area button.toggle:hover {
  color: #FFFFFF;
  background-color: #4472BA;
}
.page_header .download_csv_area button.toggle:hover svg g,
.page_header .download_pdf_area button.toggle:hover svg g {
  fill: #FFFFFF;
}
.page_header .download_csv_area button.download,
.page_header .download_pdf_area button.download {
  color: #656E73;
  background-color: #FFFFFF;
}
.page_header .download_csv_area button.download:hover,
.page_header .download_pdf_area button.download:hover {
  color: #FFFFFF;
  background-color: #656E73;
}
.page_header .download_csv_area .download_csv_modal,
.page_header .download_pdf_area .download_csv_modal {
  display: block;
  background-color: #FFFFFF;
  position: absolute;
  top: 50px;
  right: 0;
  z-index: 2050;
  text-align: left;
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  box-shadow: 0px 0px 3px #CCCCCC;
  width: max-content;
}
.page_header .download_csv_area .download_csv_modal.none,
.page_header .download_pdf_area .download_csv_modal.none {
  display: none;
}
.page_header .download_csv_area .download_csv_modal .modal_title,
.page_header .download_pdf_area .download_csv_modal .modal_title {
  padding: 16px;
  border-bottom: 1px solid #CCCCCC;
}
.page_header .download_csv_area .download_csv_modal .data_detail .data_title,
.page_header .download_pdf_area .download_csv_modal .data_detail .data_title {
  margin: 16px 8px 8px 16px;
  font-size: 12px;
}
.page_header .download_csv_area .download_csv_modal .data_detail .approval_filter,
.page_header .download_pdf_area .download_csv_modal .data_detail .approval_filter {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  padding: 8px 16px;
  align-items: center;
}
.page_header .download_csv_area .download_csv_modal .detail,
.page_header .download_pdf_area .download_csv_modal .detail {
  padding: 16px;
}
.page_header .download_csv_area .download_csv_modal .detail .button_area,
.page_header .download_pdf_area .download_csv_modal .detail .button_area {
  display: flex;
  justify-content: space-between;
}
.page_header .download_csv_area .download_csv_modal .detail .button_area button,
.page_header .download_pdf_area .download_csv_modal .detail .button_area button {
  margin-right: 16px;
}
.page_header .download_csv_area .download_csv_modal .detail .button_area button:last-of-type,
.page_header .download_pdf_area .download_csv_modal .detail .button_area button:last-of-type {
  margin-right: 0;
}
.page_header .download_csv_area .download_csv_modal .detail .comment,
.page_header .download_pdf_area .download_csv_modal .detail .comment {
  margin: 16px 0 0 0;
  color: #A8AFB4;
  font-size: 12px;
}

.page_description {
  margin-top: -8px;
  margin-bottom: 40px;
  color: #333333;
}

.page_contents {
  background-color: #FFF;
  border-radius: 4px;
  padding: 24px;
  margin-bottom: 40px;
  position: relative;
  box-shadow: 0 0 4px #ccc;
}
.page_contents.clear {
  background-color: transparent;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}

.page_display_button_area {
  display: flex;
  flex-flow: column;
  gap: 8px;
  justify-content: center;
  margin-bottom: 24px;
}
.page_display_button_area > div {
  display: flex;
  gap: 8px;
  justify-content: center;
}
.page_display_button_area > div button {
  border-radius: 4px;
  width: 100%;
  background-color: #396099;
  color: #FFFFFF;
  font-size: 16px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 60px;
}
.page_display_button_area > div button.on {
  background-image: linear-gradient(45deg, #41a4fd, #00c1cb);
}
.page_display_button_area > div button:hover {
  opacity: 0.8;
}

.close_screen {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 2003;
}
.close_screen.gray {
  background-color: #000;
  opacity: 0.3;
}
.close_screen.in_message {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  background-color: rgba(0, 0, 0, 0.6);
}
.close_screen.none {
  display: none;
}

.modal_wrap {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 2050;
  overflow-x: hidden;
  overflow-y: auto;
  display: flex;
}
.modal_wrap.modal_on_modal {
  z-index: 2150;
}

.modal_box {
  margin: auto;
  background-color: #FFFFFF;
  width: 700px;
  border-radius: 8px;
  box-shadow: 0 0 3px #CCCCCC;
  z-index: 2060;
  animation: modal_slide_in 0.7s;
  animation-fill-mode: forwards;
  color: #333333;
  position: relative;
}
.modal_box.none {
  z-index: -1;
}
.modal_box.large {
  width: 900px;
}
.modal_box.w750 {
  width: 750px;
}
.modal_box.w900 {
  width: 900px;
}
.modal_box.w1100 {
  width: 1100px;
}
.modal_box .close_modal {
  position: absolute;
  top: 12px;
  right: 12px;
  font-size: 22px;
  border: none;
  background-color: transparent;
}
.modal_box .close_modal:focus {
  outline: none;
}
.modal_box .modal_header {
  padding: 32px;
  border-bottom: 1px solid #A9AFB3;
  position: relative;
}
.modal_box .modal_header .title-icon {
  padding-right: 8px;
  vertical-align: top;
}
.modal_box .modal_header .title {
  font-size: 28px;
  display: flex;
  align-items: center;
}
.modal_box .modal_header .close_modal {
  position: absolute;
  top: 50%;
  right: 24px;
  font-size: 28px;
  border: none;
  background-color: transparent;
  transform: translateY(-50%);
}
.modal_box .modal_header .close_modal:focus {
  outline: none;
}
.modal_box .close_button {
  position: absolute;
  top: -50px;
  right: -50px;
  font-size: 40px;
  border: none;
  background-color: transparent;
  color: #FFF;
}
.modal_box .close_button:focus {
  outline: none;
}
.modal_box .close_button:hover {
  opacity: 0.8;
}
.modal_box .modal_body {
  padding: 32px;
  max-height: 500px;
  overflow: auto;
}
.modal_box .modal_body .modal-title {
  font-size: 24px;
  margin-bottom: 24px;
}
.modal_box .modal_body .modal-body {
  text-align: center;
}
.modal_box .modal_body .item {
  margin-bottom: 16px;
}
.modal_box .modal_body .item .title {
  margin-bottom: 8px;
  font-weight: bold;
}
.modal_box .modal_body .item .title .annotation {
  font-size: 12px;
  font-weight: normal;
  color: #FF0000;
}
.modal_box .modal_body .item .title .annotation::before {
  content: "※";
  margin-right: 4px;
}
.modal_box .modal_body .item .title.flex {
  display: flex;
  align-items: center;
  gap: 4px;
}
.modal_box .modal_body .item .title.flex .label {
  background-color: #999999;
  padding: 2px 4px;
  border-radius: 2px;
  color: #FFFFFF;
  font-size: 9px;
  font-weight: normal;
}
.modal_box .modal_body .item .title.flex .label.red {
  background-color: #FF0000;
}
.modal_box .modal_body .item .title.flex .label.green {
  background-color: #007916;
}
.modal_box .modal_body .item .detail {
  min-height: 34px;
}
.modal_box .modal_body .item .detail input[type=text],
.modal_box .modal_body .item .detail input[type=number],
.modal_box .modal_body .item .detail select {
  height: 34px;
  padding: 8px 16px;
  background-color: #FFFFFF;
  border: solid 1px #CCCCCC;
  border-radius: 4px;
}
.modal_box .modal_body .item .detail input[type=text]:focus,
.modal_box .modal_body .item .detail input[type=number]:focus,
.modal_box .modal_body .item .detail select:focus {
  outline: none;
}
.modal_box .modal_body .item .detail input[type=checkbox],
.modal_box .modal_body .item .detail input[type=radio] {
  margin-right: 4px;
}
.modal_box .modal_body .item .detail label {
  margin-bottom: 0;
}
.modal_box .modal_body .item .detail label + label {
  margin-left: 8px;
}
.modal_box .modal_body .item .detail + .detail {
  margin-top: 12px;
}
.modal_box .modal_body .item .detail .icon {
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.modal_box .modal_body .item .detail.equal_space {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.modal_box .modal_body .item .detail.row_1 input[type=text],
.modal_box .modal_body .item .detail.row_1 input[type=number],
.modal_box .modal_body .item .detail.row_1 select {
  width: 100%;
}
.modal_box .modal_body .item .detail.row_1.code {
  display: flex;
}
.modal_box .modal_body .item .detail.row_1.code label {
  align-items: center;
  display: flex;
}
.modal_box .modal_body .item .detail.row_1.code label input[type=radio] {
  margin-right: 4px;
  margin-top: 0;
}
.modal_box .modal_body .item .detail.row_2 input[type=text],
.modal_box .modal_body .item .detail.row_2 input[type=number],
.modal_box .modal_body .item .detail.row_2 select {
  width: 100%;
}
.modal_box .modal_body .item .detail.row_2.filter {
  display: flex;
}
.modal_box .modal_body .item .detail.row_2.filter label {
  align-items: center;
  display: flex;
}
.modal_box .modal_body .item .detail.row_2.filter label input[type=radio] {
  margin-right: 4px;
  margin-top: 0;
}
.modal_box .modal_body .item .detail.preset {
  display: flex;
  justify-content: space-around;
}
.modal_box .modal_body .item .detail.preset button {
  display: inline-block;
  text-align: center;
  width: 24%;
  padding: 8px 12px;
  border-radius: 4px;
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  color: #656E73;
}
.modal_box .modal_body .item .detail .sample_picture {
  margin: 10px 0px;
  border: 2px dotted #EEEEEE;
  color: #AAAAAA;
  padding: 10px;
}
.modal_box .modal_body .item .detail .dummy_input {
  width: 100%;
  display: flex;
  border-radius: 4px;
  padding: 8px 16px;
  background-color: #eeeeee;
  color: #777777;
  cursor: not-allowed;
}
.modal_box .modal_body .item .detail .dummy_input div:nth-child(2) {
  margin-left: 8px;
}
.modal_box .modal_body .item .error {
  margin-top: 4px;
  color: #C61616;
}
.modal_box .modal_body .item .add_conditions {
  display: inline-block;
  margin-top: 16px;
  color: #4472BA;
  cursor: pointer;
}
.modal_box .modal_body .item .text_link {
  margin-top: 8px;
  color: #333333;
}
.modal_box .modal_body .item .text_link span {
  margin-left: 2px;
  color: #4472BA;
  text-decoration: underline;
  cursor: pointer;
}
.modal_box.modal_on_modal .modal_body {
  max-height: none;
}
.modal_box.large .modal_body {
  max-height: 660px;
}
.modal_box .modal_footer {
  display: flex;
  padding: 32px;
  border-top: 1px solid #A9AFB3;
  justify-content: space-around;
}
.modal_box .modal_footer button {
  display: inline-block;
  text-align: center;
  width: 49%;
  background-color: #4472BA;
  border: 1px solid #4472BA;
  color: #FFFFFF;
  padding: 8px 12px;
  border-radius: 4px;
}
.modal_box .modal_footer button:hover {
  background-color: #094E8D;
  text-decoration: none;
}
.modal_box .modal_footer button:focus {
  outline: none;
}
.modal_box .modal_footer button:disabled {
  cursor: not-allowed;
  opacity: 0.65;
}
.modal_box .modal_footer button.cancel {
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  color: #656E73;
}
.modal_box .modal_footer button.cancel:hover {
  background-color: #92999E;
  color: #FFFFFF;
}
.modal_box .modal_footer button.cancel:disabled {
  cursor: not-allowed;
  opacity: 0.65;
}
.modal_box .modal_footer button.cancel:disabled:hover {
  background-color: #FFFFFF;
  color: #656E73;
}
.modal_box .modal_footer button.complete {
  background-color: #276b00;
  border: 1px solid #276b00;
}
.modal_box .modal_footer button.complete:hover {
  background-color: #3ba000;
}
.modal_box.tutorial .modal_footer button {
  width: 15%;
}
.modal_box.modal_on_modal {
  z-index: 2150;
}
.modal_box.extra_order .modal_body {
  max-height: 700px;
  overflow: auto;
}
.modal_box.extra_order .modal_body button.quotation {
  border: 1px solid #666666;
  border-radius: 4px;
  padding: 4px 8px;
  background-color: #FFFFFF;
}
.modal_box.extra_order .modal_body button.quotation:hover {
  background-color: #EEEEEE;
}

.confirmation_modal {
  background-color: #FFFFFF;
  width: 400px;
  border-radius: 8px;
  box-shadow: 0 0 3px #cccccc;
  z-index: 2060;
  animation: confirmation_modal_slide_in 0.4s;
  animation-fill-mode: forwards;
  color: #333333;
  position: relative;
  margin: auto;
}
.confirmation_modal.none {
  z-index: -1;
}
.confirmation_modal .confirmation_modal_header {
  padding: 16px;
  border-bottom: 1px solid #A9AFB3;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.confirmation_modal .confirmation_modal_header .title {
  font-size: 20px;
}
.confirmation_modal .confirmation_modal_header .close_modal {
  font-size: 22px;
  padding: 0;
  border: none;
  background-color: transparent;
}
.confirmation_modal .confirmation_modal_header .close_modal:focus {
  outline: none;
}
.confirmation_modal .confirmation_modal_body {
  padding: 32px;
  max-height: 480px;
  word-break: break-all;
  overflow: auto;
}
.confirmation_modal .confirmation_modal_body .item {
  margin-bottom: 16px;
}
.confirmation_modal .confirmation_modal_body .item .title {
  margin-bottom: 8px;
  font-weight: bold;
}
.confirmation_modal .confirmation_modal_body .item .title .annotation {
  font-size: 12px;
  font-weight: normal;
  color: #FF0000;
}
.confirmation_modal .confirmation_modal_body .item .title .annotation::before {
  content: "※";
  margin-right: 4px;
}
.confirmation_modal .confirmation_modal_body .item .detail {
  min-height: 34px;
}
.confirmation_modal .confirmation_modal_body .item .detail input[type=text],
.confirmation_modal .confirmation_modal_body .item .detail input[type=number],
.confirmation_modal .confirmation_modal_body .item .detail select {
  height: 34px;
  padding: 8px 16px;
  border: none;
  background-color: #ECF0F5;
  border-radius: 4px;
}
.confirmation_modal .confirmation_modal_body .item .detail input[type=text]:focus,
.confirmation_modal .confirmation_modal_body .item .detail input[type=number]:focus,
.confirmation_modal .confirmation_modal_body .item .detail select:focus {
  outline: none;
}
.confirmation_modal .confirmation_modal_body .item .detail input[type=text]:focus,
.confirmation_modal .confirmation_modal_body .item .detail input[type=number]:focus {
  border: 2px solid #d8e3f4;
  background-color: #FFFFFF;
  padding: 6px 14px;
}
.confirmation_modal .confirmation_modal_body .item .detail input[type=checkbox],
.confirmation_modal .confirmation_modal_body .item .detail input[type=radio] {
  margin-right: 4px;
}
.confirmation_modal .confirmation_modal_body .item .detail label {
  margin-bottom: 0;
}
.confirmation_modal .confirmation_modal_body .item .detail label + label {
  margin-left: 8px;
}
.confirmation_modal .confirmation_modal_body .item .detail + .detail {
  margin-top: 12px;
}
.confirmation_modal .confirmation_modal_body .item .detail .icon {
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.confirmation_modal .confirmation_modal_body .item .detail.equal_space {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.confirmation_modal .confirmation_modal_body .item .detail.row_1 input[type=text],
.confirmation_modal .confirmation_modal_body .item .detail.row_1 input[type=number],
.confirmation_modal .confirmation_modal_body .item .detail.row_1 select {
  width: 100%;
}
.confirmation_modal .confirmation_modal_body .item .detail.row_1.code {
  display: flex;
}
.confirmation_modal .confirmation_modal_body .item .detail.row_1.code label {
  align-items: center;
  display: flex;
}
.confirmation_modal .confirmation_modal_body .item .detail.row_1.code label input[type=radio] {
  margin-right: 4px;
  margin-top: 0;
}
.confirmation_modal .confirmation_modal_body .item .detail.preset {
  display: flex;
  justify-content: space-around;
}
.confirmation_modal .confirmation_modal_body .item .detail.preset button {
  display: inline-block;
  text-align: center;
  width: 24%;
  padding: 8px 12px;
  border-radius: 4px;
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  color: #656E73;
}
.confirmation_modal .confirmation_modal_body .item .detail .sample_picture {
  margin: 10px 0px;
  border: 2px dotted #EEEEEE;
  color: #AAAAAA;
  padding: 10px;
}
.confirmation_modal .confirmation_modal_body .item .error {
  margin-top: 4px;
  color: #C61616;
}
.confirmation_modal .confirmation_modal_body .item .add_conditions {
  display: inline-block;
  margin-top: 16px;
  color: #4472BA;
  cursor: pointer;
}
.confirmation_modal .confirmation_modal_body .item .text_link {
  margin-top: 8px;
  color: #333333;
}
.confirmation_modal .confirmation_modal_body .item .text_link span {
  margin-left: 2px;
  color: #4472BA;
  text-decoration: underline;
  cursor: pointer;
}
.confirmation_modal .confirmation_modal_footer {
  display: flex;
  padding: 16px;
  border-top: 1px solid #A9AFB3;
  justify-content: space-between;
}
.confirmation_modal .confirmation_modal_footer button {
  display: inline-block;
  text-align: center;
  width: 49%;
  background-color: #4472BA;
  border: 1px solid #4472BA;
  color: #FFFFFF;
  padding: 8px 12px;
  border-radius: 4px;
}
.confirmation_modal .confirmation_modal_footer button:hover {
  background-color: #094E8D;
  text-decoration: none;
}
.confirmation_modal .confirmation_modal_footer button:focus {
  outline: none;
}
.confirmation_modal .confirmation_modal_footer button.cancel {
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  color: #656E73;
}
.confirmation_modal .confirmation_modal_footer button.cancel:hover {
  background-color: #92999E;
  color: #FFFFFF;
}
.confirmation_modal .confirmation_modal_footer button.delete, .confirmation_modal .confirmation_modal_footer button.stop {
  background-color: #C61616;
  border: 1px solid #C61616;
  color: #FFFFFF;
}
.confirmation_modal .confirmation_modal_footer button.delete:hover, .confirmation_modal .confirmation_modal_footer button.stop:hover {
  background-color: #d75b5b;
  color: #FFFFFF;
}
.confirmation_modal .confirmation_modal_footer button.start {
  background-color: #0D9554;
  border: 1px solid #0D9554;
  color: #FFFFFF;
}
.confirmation_modal .confirmation_modal_footer button.start:hover {
  background-color: #3daa76;
  color: #FFFFFF;
}

.hidden {
  visibility: hidden;
  width: 0;
}

.none {
  display: none;
}

.alert {
  border-radius: 3px;
  width: 100vw;
  display: flex;
  align-items: center;
  padding: 8px;
  position: fixed;
  top: 50px;
  left: 0;
  color: #FFF;
}
.alert h4 {
  font-weight: 600;
}
.alert .icon {
  margin-right: 10px;
}
.alert .close {
  color: #000;
  opacity: 0.2;
  filter: alpha(opacity=20);
}
.alert .close:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}
.alert a {
  color: #fff;
  text-decoration: underline;
}

.alert-success {
  border-color: #008d4c;
  background-color: #008d4c;
}

.alert-danger,
.alert-error {
  border-color: #d73925;
  background-color: #d73925;
}

.alert-warning {
  border-color: #e08e0b;
  background-color: #e08e0b;
}

.alert-info {
  border-color: #00acd6;
  background-color: #00acd6;
}

.diagnosis {
  position: relative;
}
.diagnosis .y_title {
  color: #333333;
  font-size: 11px;
  margin: 0 12px -12px;
}
.diagnosis .x_title {
  color: #333333;
  text-align: center;
  font-size: 11px;
  margin: -8px 0;
}
.diagnosis .graph {
  height: 100%;
}
.diagnosis .graph table {
  table-layout: fixed;
  width: 100%;
  height: 100%;
}
.diagnosis .graph td {
  border-collapse: collapse;
  border: 1px solid #FFFFFF;
  background-color: #ECF0F5;
}
.diagnosis .graph tr:nth-child(n+1):nth-child(-n+4) td:nth-child(n+1):nth-child(-n+4) {
  background-color: #DADFE7;
}
.diagnosis .graph tr:nth-child(n+1):nth-child(-n+4) td:nth-child(n+5):nth-child(-n+8) {
  background-color: #B7BECC;
}
.diagnosis .graph tr:nth-child(n+5):nth-child(-n+8) td:nth-child(n+1):nth-child(-n+4) {
  background-color: #ECF0F5;
}
.diagnosis .graph tr:nth-child(n+5):nth-child(-n+8) td:nth-child(n+5):nth-child(-n+8) {
  background-color: #C8CED9;
}
.diagnosis .usage {
  margin: 24px 0 16px;
}
.diagnosis .usage > div:nth-child(1) svg {
  background-color: #68E8C0;
}
.diagnosis .usage > div:nth-child(2) svg {
  background-color: #9DEBD5;
}
.diagnosis .usage > div:nth-child(3) svg {
  background-color: #D1EEEA;
}
.diagnosis .usage > div:nth-child(3) svg g use {
  fill: #00E396;
}
.diagnosis .usage > div:nth-child(4) svg {
  background-color: #ECF0F5;
}
.diagnosis .usage > div:nth-child(4) svg g use {
  fill: #00E396;
}

.content-block {
  padding: 24px 0;
  border-bottom: 1px solid #D6DADE;
  margin: 0 24px;
}
.content-block .button {
  display: inline-block;
  text-align: center;
  min-width: 200px;
  background-color: #4472BA;
  border: 1px solid #4472BA;
  color: #FFFFFF;
  padding: 8px 12px;
  border-radius: 4px;
}
.content-block .button:hover {
  background-color: #094E8D;
  text-decoration: none;
}
.content-block .button:disabled {
  opacity: 0.5;
}
.content-block .button:disabled:hover {
  background-color: #4472BA;
  text-decoration: none;
}
.content-block .button-area {
  position: relative;
}
.content-block button.reload {
  border: solid 1px #CCCCCC;
  border-radius: 4px;
  font-size: 14px;
  padding: 4px 8px;
  color: #666666;
  margin: 0;
  background-color: #FFFFFF;
}
.content-block button.reload:hover {
  background-color: #EEEEEE;
}
.content-block button.reload:disabled {
  color: #999999;
}
.content-block button.reload:disabled:hover {
  background-color: #EEEEEE;
}
.content-block .block-header {
  position: relative;
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.content-block .block-header .title {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  position: relative;
}
.content-block .block-header .title .help .icon {
  margin-left: 4px;
}
.content-block .block-header .description {
  font-size: 14px;
  color: #333333;
}
.content-block .block-header .description p {
  margin: 0;
}
.content-block .block-header.no_margin {
  margin-bottom: 0;
}
.content-block .block-header .display_switch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px;
  border: 1px solid #4472ba;
  border-radius: 40px;
  margin-left: 8px;
  background-color: #4472ba;
  gap: 4px;
}
.content-block .block-header .display_switch > div {
  border-radius: 18px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  position: relative;
  padding: 0 8px;
}
.content-block .block-header .display_switch > div span {
  font-size: 10px;
  margin-left: 4px;
}
.content-block .block-header .display_switch > div:nth-of-type(1) {
  background-color: transparent;
  color: #FFFFFF;
}
.content-block .block-header .display_switch > div:nth-of-type(2) {
  background-color: #FFFFFF;
  color: #4372BA;
}
.content-block .block-header .display_switch > div .help {
  height: auto;
}
.content-block .block-header .display_switch.check > div:nth-of-type(1) {
  background-color: #FFFFFF;
  color: #4372BA;
}
.content-block .block-header .display_switch.check > div:nth-of-type(2) {
  background-color: transparent;
  color: #FFFFFF;
}
.content-block .block-header .display_switch.labeling {
  border: 1px solid #A3A3A3;
  background-color: #FFFFFF;
}
.content-block .block-header .display_switch.labeling > div:nth-of-type(1) {
  background-color: transparent;
  color: #666666;
}
.content-block .block-header .display_switch.labeling > div:nth-of-type(2) {
  background-color: #666666;
  color: #FFFFFF;
}
.content-block .block-header .display_switch.labeling.check > div:nth-of-type(1) {
  background-color: #0B9554;
  color: #FFFFFF;
}
.content-block .block-header .display_switch.labeling.check > div:nth-of-type(2) {
  background-color: transparent;
  color: #666666;
}
.content-block .block-header .display_switch.labeling_status {
  border: 1px solid #A3A3A3;
  background-color: #FFFFFF;
}
.content-block .block-header .display_switch.labeling_status > div:nth-of-type(1) {
  background-color: transparent;
  color: #666666;
}
.content-block .block-header .display_switch.labeling_status > div:nth-of-type(2) {
  background-color: #0B9554;
  color: #FFFFFF;
}
.content-block .block-header .display_switch.labeling_status.check > div:nth-of-type(1) {
  background-color: #0B9554;
  color: #FFFFFF;
}
.content-block .block-header .display_switch.labeling_status.check > div:nth-of-type(2) {
  background-color: transparent;
  color: #666666;
}
.content-block .block-header .display_switch.labeling_status.sticky {
  position: fixed;
  top: 80px;
  right: 60px;
  z-index: 1010;
}
.content-block .block-detail .plan {
  font-size: 28px;
  color: #4472BA;
}
.content-block .block-detail .strong {
  font-weight: bold;
}
.content-block .block-detail .description {
  font-size: 14px;
  color: #333333;
}
.content-block .block-detail .description.red_mini {
  margin-top: 8px;
  font-size: 12px;
  color: #FF0000;
  padding-top: 0;
}
.content-block .block-detail .description.red_mini p {
  margin: 0;
}
.content-block .block-detail .record-area {
  margin: 8px 0px;
  border-radius: 4px;
}
.content-block .block-detail .record-area select {
  padding: 4px 8px;
  margin-left: 8px;
}
.content-block .block-detail .qr_code {
  min-height: 200px;
}
.content-block .block-detail .mfa_input {
  margin-bottom: 8px;
}
.content-block .block-detail .mfa_input p {
  margin: 0;
}
.content-block .block-detail .mfa_input input[type=text] {
  width: 100%;
  background-color: #EEEEEE;
  padding: 4px 8px;
  border: solid 1px #D6DADE;
  border-radius: 4px;
  outline: none;
}
.content-block .block-detail.mfa input[type=text] {
  min-width: 250px;
  background-color: #FFFFFF;
  padding: 8px 16px;
  border: solid 1px #D6DADE;
  border-radius: 4px 0 0 4px;
  outline: none;
  margin-bottom: 8px;
}
.content-block .block-detail.mfa .button {
  display: inline-block;
  text-align: center;
  min-width: 80px;
  background-color: #4472BA;
  border: 1px solid #4472BA;
  color: #FFFFFF;
  padding: 8px 12px;
  border-radius: 0 4px 4px 0;
  margin-bottom: 8px;
}
.content-block .block-detail.mfa .button:hover {
  background-color: #094E8D;
  text-decoration: none;
}
.content-block .block-detail.mfa .button:disabled {
  opacity: 0.5;
}
.content-block .block-detail.mfa .button:disabled:hover {
  background-color: #4472BA;
  text-decoration: none;
}
.content-block .block-detail .button {
  display: inline-block;
  text-align: center;
  min-width: 200px;
  background-color: #4472BA;
  border: 1px solid #4472BA;
  color: #FFFFFF;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 14px;
}
.content-block .block-detail .button:hover {
  background-color: #094E8D;
  text-decoration: none;
}
.content-block .block-detail .button:disabled {
  opacity: 0.5;
}
.content-block .block-detail .button:disabled:hover {
  background-color: #4472BA;
  text-decoration: none;
}
.content-block .block-detail .button.delete {
  background-color: #C61616;
  border: 1px solid #C61616;
  color: #FFFFFF;
}
.content-block .block-detail .button.delete:hover {
  background-color: #d75b5b;
  color: #FFFFFF;
}
.content-block .block-detail .button.delete:focus {
  outline: none;
}
.content-block .block-detail .button.delete:disabled {
  cursor: not-allowed;
}
.content-block .block-detail .button.cancel {
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  color: #656E73;
}
.content-block .block-detail .button.cancel:hover {
  background-color: #92999E;
  color: #FFFFFF;
}
.content-block .block-detail .button.cancel:disabled {
  cursor: not-allowed;
  opacity: 0.65;
}
.content-block .block-detail .button.cancel:disabled:hover {
  background-color: #FFFFFF;
  color: #656E73;
}
.content-block .block-detail .toggle_switch {
  position: relative;
  width: 112px;
  height: 34px;
}
.content-block .block-detail .toggle_switch .toggle_label {
  width: 112px;
  height: 34px;
  background: #d5dadf;
  position: relative;
  display: inline-block;
  border-radius: 6px;
  transition: 0.4s;
  box-sizing: border-box;
}
.content-block .block-detail .toggle_switch .toggle_label .toggle_left {
  position: absolute;
  top: 7px;
  left: 25%;
  transform: translateX(-50%);
  z-index: 10;
  color: #FFFFFF;
  font-weight: normal;
  font-size: 14px;
  pointer-events: none;
}
.content-block .block-detail .toggle_switch .toggle_label .toggle_right {
  position: absolute;
  top: 7px;
  right: 25%;
  transform: translateX(50%);
  z-index: 10;
  color: #92999E;
  font-weight: normal;
  font-size: 14px;
  pointer-events: none;
}
.content-block .block-detail .toggle_switch .toggle_label .back_ground {
  content: "";
  position: absolute;
  width: 55px;
  height: 30px;
  border-radius: 6px;
  left: 2px;
  top: 2px;
  z-index: 2;
  background: #4472BA;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  transition: 0.4s;
}
.content-block .block-detail .toggle_switch .toggle_label .toggle_input {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  opacity: 0;
  cursor: pointer;
}
.content-block .block-detail .toggle_switch .toggle_label .toggle_input:checked ~ .toggle_left {
  color: #92999E;
}
.content-block .block-detail .toggle_switch .toggle_label .toggle_input:checked ~ .toggle_right {
  color: #FFFFFF;
}
.content-block .block-detail .toggle_switch .toggle_label .toggle_input:checked ~ .back_ground {
  left: 55px;
  width: 55px;
  background-color: #333333;
}
.content-block .block-detail .flex-table {
  display: inline-table;
  width: 100%;
  table-layout: fixed;
}
.content-block .block-detail .flex-table thead {
  color: #333333;
  border-bottom: 1px solid #D5DADF;
}
.content-block .block-detail .flex-table thead tr,
.content-block .block-detail .flex-table tbody tr {
  display: flex;
  min-height: 50px;
  padding: 0 16px;
}
.content-block .block-detail .flex-table thead tr:nth-child(2n),
.content-block .block-detail .flex-table tbody tr:nth-child(2n) {
  background-color: #F5F5F5;
}
.content-block .block-detail .flex-table thead tr th,
.content-block .block-detail .flex-table thead tr td,
.content-block .block-detail .flex-table tbody tr th,
.content-block .block-detail .flex-table tbody tr td {
  display: flex;
  padding: 0.5em;
  align-items: center;
}
.content-block .block-detail .flex-table thead tr th button,
.content-block .block-detail .flex-table thead tr td button,
.content-block .block-detail .flex-table tbody tr th button,
.content-block .block-detail .flex-table tbody tr td button {
  min-width: auto;
}
.content-block .block-detail .flex-table thead tr th button.update,
.content-block .block-detail .flex-table thead tr td button.update,
.content-block .block-detail .flex-table tbody tr th button.update,
.content-block .block-detail .flex-table tbody tr td button.update {
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  border-radius: 4px;
  padding: 4px 16px;
  color: #656E73;
}
.content-block .block-detail .flex-table thead tr th button.update:hover,
.content-block .block-detail .flex-table thead tr td button.update:hover,
.content-block .block-detail .flex-table tbody tr th button.update:hover,
.content-block .block-detail .flex-table tbody tr td button.update:hover {
  background-color: #656E73;
  color: #FFFFFF;
}
.content-block .block-detail .flex-table thead tr th button.update:focus,
.content-block .block-detail .flex-table thead tr td button.update:focus,
.content-block .block-detail .flex-table tbody tr th button.update:focus,
.content-block .block-detail .flex-table tbody tr td button.update:focus {
  outline: none;
}
.content-block .block-detail .flex-table thead tr th button.update:disabled,
.content-block .block-detail .flex-table thead tr td button.update:disabled,
.content-block .block-detail .flex-table tbody tr th button.update:disabled,
.content-block .block-detail .flex-table tbody tr td button.update:disabled {
  color: #d0d3d5;
  border: 1px solid #d0d3d5;
  background-color: #FFFFFF;
}
.content-block .block-detail .flex-table thead tr th button.delete,
.content-block .block-detail .flex-table thead tr td button.delete,
.content-block .block-detail .flex-table tbody tr th button.delete,
.content-block .block-detail .flex-table tbody tr td button.delete {
  background-color: #C61616;
  border: 1px solid #C61616;
  color: #FFFFFF;
}
.content-block .block-detail .flex-table thead tr th button.delete:hover,
.content-block .block-detail .flex-table thead tr td button.delete:hover,
.content-block .block-detail .flex-table tbody tr th button.delete:hover,
.content-block .block-detail .flex-table tbody tr td button.delete:hover {
  background-color: #d75b5b;
  color: #FFFFFF;
}
.content-block .block-detail .flex-table thead tr th button.delete:focus,
.content-block .block-detail .flex-table thead tr td button.delete:focus,
.content-block .block-detail .flex-table tbody tr th button.delete:focus,
.content-block .block-detail .flex-table tbody tr td button.delete:focus {
  outline: none;
}
.content-block .block-detail .flex-table thead tr th button.mini_menu_button,
.content-block .block-detail .flex-table thead tr td button.mini_menu_button,
.content-block .block-detail .flex-table tbody tr th button.mini_menu_button,
.content-block .block-detail .flex-table tbody tr td button.mini_menu_button {
  background-color: transparent;
  border: none;
}
.content-block .block-detail .flex-table thead tr th button.mini_menu_button:focus,
.content-block .block-detail .flex-table thead tr td button.mini_menu_button:focus,
.content-block .block-detail .flex-table tbody tr th button.mini_menu_button:focus,
.content-block .block-detail .flex-table tbody tr td button.mini_menu_button:focus {
  outline: none;
}
.content-block .block-detail .flex-table thead tr th button.flex,
.content-block .block-detail .flex-table thead tr td button.flex,
.content-block .block-detail .flex-table tbody tr th button.flex,
.content-block .block-detail .flex-table tbody tr td button.flex {
  display: flex;
  align-items: center;
}
.content-block .block-detail .flex-table thead tr th .title,
.content-block .block-detail .flex-table thead tr td .title,
.content-block .block-detail .flex-table tbody tr th .title,
.content-block .block-detail .flex-table tbody tr td .title {
  color: #4472BA;
  cursor: pointer;
}
.content-block .block-detail .flex-table thead tr th .title:hover,
.content-block .block-detail .flex-table thead tr td .title:hover,
.content-block .block-detail .flex-table tbody tr th .title:hover,
.content-block .block-detail .flex-table tbody tr td .title:hover {
  text-decoration: underline;
}
.content-block .block-detail .flex-table thead tr th .icon,
.content-block .block-detail .flex-table thead tr td .icon,
.content-block .block-detail .flex-table tbody tr th .icon,
.content-block .block-detail .flex-table tbody tr td .icon {
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.content-block .block-detail .flex-table thead tr th.no_data,
.content-block .block-detail .flex-table thead tr td.no_data,
.content-block .block-detail .flex-table tbody tr th.no_data,
.content-block .block-detail .flex-table tbody tr td.no_data {
  width: 100% !important;
  height: 300px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  flex-wrap: wrap;
}
.content-block .block-detail .flex-table thead tr th.no_data .text,
.content-block .block-detail .flex-table thead tr td.no_data .text,
.content-block .block-detail .flex-table tbody tr th.no_data .text,
.content-block .block-detail .flex-table tbody tr td.no_data .text {
  font-size: 30px;
  color: #CCCCCC;
  margin-bottom: 16px;
}
.content-block .block-detail .flex-table thead tr th .generating,
.content-block .block-detail .flex-table thead tr td .generating,
.content-block .block-detail .flex-table tbody tr th .generating,
.content-block .block-detail .flex-table tbody tr td .generating {
  color: #fd6a6a;
  font-weight: bold;
}
.content-block .block-detail .flex-table thead tr.stopped,
.content-block .block-detail .flex-table tbody tr.stopped {
  color: #BFC4C9;
}
.content-block .block-detail .flex-table thead tr.stopped .title,
.content-block .block-detail .flex-table tbody tr.stopped .title {
  color: #BFC4C9;
  cursor: default;
}
.content-block .block-detail .flex-table thead tr.stopped .title:hover,
.content-block .block-detail .flex-table tbody tr.stopped .title:hover {
  text-decoration: none;
}
.content-block .block-detail .flex-table.member_table th,
.content-block .block-detail .flex-table.member_table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.content-block .block-detail .flex-table.member_table th:nth-child(1),
.content-block .block-detail .flex-table.member_table td:nth-child(1) {
  width: 25%;
}
.content-block .block-detail .flex-table.member_table th:nth-child(1) .link,
.content-block .block-detail .flex-table.member_table td:nth-child(1) .link {
  color: #4472BA;
  cursor: pointer;
}
.content-block .block-detail .flex-table.member_table th:nth-child(1) .link:hover,
.content-block .block-detail .flex-table.member_table td:nth-child(1) .link:hover {
  text-decoration: underline;
}
.content-block .block-detail .flex-table.member_table th:nth-child(2),
.content-block .block-detail .flex-table.member_table td:nth-child(2) {
  width: 25%;
}
.content-block .block-detail .flex-table.member_table th:nth-child(3),
.content-block .block-detail .flex-table.member_table td:nth-child(3) {
  width: 25%;
}
.content-block .block-detail .flex-table.member_table th:nth-child(4),
.content-block .block-detail .flex-table.member_table td:nth-child(4) {
  width: 25%;
}
.content-block .block-detail .flex-table.team_table th,
.content-block .block-detail .flex-table.team_table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.content-block .block-detail .flex-table.team_table th:nth-child(1),
.content-block .block-detail .flex-table.team_table td:nth-child(1) {
  width: 25%;
}
.content-block .block-detail .flex-table.team_table th:nth-child(1) .link,
.content-block .block-detail .flex-table.team_table td:nth-child(1) .link {
  color: #4472BA;
  cursor: pointer;
}
.content-block .block-detail .flex-table.team_table th:nth-child(1) .link:hover,
.content-block .block-detail .flex-table.team_table td:nth-child(1) .link:hover {
  text-decoration: underline;
}
.content-block .block-detail .flex-table.team_table th:nth-child(2),
.content-block .block-detail .flex-table.team_table td:nth-child(2) {
  width: 75%;
}
.content-block .block-detail .flex-table.export_csv_table th,
.content-block .block-detail .flex-table.export_csv_table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.content-block .block-detail .flex-table.export_csv_table th:nth-child(1),
.content-block .block-detail .flex-table.export_csv_table td:nth-child(1) {
  width: 10%;
}
.content-block .block-detail .flex-table.export_csv_table th:nth-child(2),
.content-block .block-detail .flex-table.export_csv_table td:nth-child(2) {
  width: 20%;
}
.content-block .block-detail .flex-table.export_csv_table th:nth-child(3),
.content-block .block-detail .flex-table.export_csv_table td:nth-child(3) {
  width: 20%;
  gap: 4px;
  flex-wrap: wrap;
}
.content-block .block-detail .flex-table.export_csv_table th:nth-child(3) > .element_block,
.content-block .block-detail .flex-table.export_csv_table td:nth-child(3) > .element_block {
  background-color: #ffffff;
  color: #666666;
  border: solid 1px #CCCCCC;
  border-radius: 10px;
  padding: 4px 8px;
  font-size: 10px;
}
.content-block .block-detail .flex-table.export_csv_table th:nth-child(4),
.content-block .block-detail .flex-table.export_csv_table td:nth-child(4) {
  width: 10%;
}
.content-block .block-detail .flex-table.export_csv_table th:nth-child(5),
.content-block .block-detail .flex-table.export_csv_table td:nth-child(5) {
  width: 20%;
}
.content-block .block-detail .flex-table.export_csv_table th:nth-child(6),
.content-block .block-detail .flex-table.export_csv_table td:nth-child(6) {
  width: 20%;
}
.content-block .block-detail .flex-table.export_csv_table .download {
  border: solid 1px #008000;
  border-radius: 4px;
  color: #008000;
  background-color: #FFF;
  display: flex;
  align-items: center;
  gap: 4px;
}
.content-block .block-detail .flex-table.export_csv_table .download .csv_icon {
  width: 16px;
  height: 16px;
}
.content-block .block-detail .flex-table.export_csv_table .download:hover {
  background-color: #ecffec;
}
.content-block .block-detail .flex-table.export_data_table th,
.content-block .block-detail .flex-table.export_data_table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.content-block .block-detail .flex-table.export_data_table th:nth-child(1),
.content-block .block-detail .flex-table.export_data_table td:nth-child(1) {
  width: 20%;
}
.content-block .block-detail .flex-table.export_data_table th:nth-child(2),
.content-block .block-detail .flex-table.export_data_table td:nth-child(2) {
  width: 40%;
}
.content-block .block-detail .flex-table.export_data_table th:nth-child(3),
.content-block .block-detail .flex-table.export_data_table td:nth-child(3) {
  width: 20%;
}
.content-block .block-detail .flex-table.export_data_table th:nth-child(4),
.content-block .block-detail .flex-table.export_data_table td:nth-child(4) {
  width: 20%;
}
.content-block .block-detail .flex-table.export_data_table .download {
  border: solid 1px #008000;
  border-radius: 4px;
  color: #008000;
  background-color: #FFF;
  display: flex;
  align-items: center;
  gap: 4px;
}
.content-block .block-detail .flex-table.export_data_table .download .csv_icon {
  width: 16px;
  height: 16px;
}
.content-block .block-detail .flex-table.export_data_table .download:hover {
  background-color: #ecffec;
}
.content-block .block-detail .flex-table.team_list_table th,
.content-block .block-detail .flex-table.team_list_table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.content-block .block-detail .flex-table.team_list_table th:nth-child(1),
.content-block .block-detail .flex-table.team_list_table td:nth-child(1) {
  width: 25%;
}
.content-block .block-detail .flex-table.team_list_table th:nth-child(2),
.content-block .block-detail .flex-table.team_list_table td:nth-child(2) {
  width: 33%;
  display: grid !important;
}
.content-block .block-detail .flex-table.team_list_table th:nth-child(3),
.content-block .block-detail .flex-table.team_list_table td:nth-child(3) {
  width: 33%;
  display: grid !important;
}
.content-block .block-detail .flex-table.team_list_table th:nth-child(4),
.content-block .block-detail .flex-table.team_list_table td:nth-child(4) {
  width: 9%;
  justify-content: center;
}
.content-block .block-detail .flex-table.team_list_table .other {
  cursor: pointer;
  text-decoration: dashed underline;
  color: #999999;
}
.content-block .block-detail .flex-table.admin_list_table th,
.content-block .block-detail .flex-table.admin_list_table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.content-block .block-detail .flex-table.admin_list_table th:nth-child(1),
.content-block .block-detail .flex-table.admin_list_table td:nth-child(1) {
  width: 35%;
}
.content-block .block-detail .flex-table.admin_list_table th:nth-child(2),
.content-block .block-detail .flex-table.admin_list_table td:nth-child(2) {
  width: 35%;
}
.content-block .block-detail .flex-table.admin_list_table th:nth-child(3),
.content-block .block-detail .flex-table.admin_list_table td:nth-child(3) {
  width: 20%;
}
.content-block .block-detail .flex-table.admin_list_table th:nth-child(4),
.content-block .block-detail .flex-table.admin_list_table td:nth-child(4) {
  width: 10%;
  justify-content: center;
}
.content-block .block-detail .flex-table.ip_address_list_table th,
.content-block .block-detail .flex-table.ip_address_list_table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
  min-height: 60px;
}
.content-block .block-detail .flex-table.ip_address_list_table th:nth-child(1),
.content-block .block-detail .flex-table.ip_address_list_table td:nth-child(1) {
  width: 40%;
}
.content-block .block-detail .flex-table.ip_address_list_table th:nth-child(2),
.content-block .block-detail .flex-table.ip_address_list_table td:nth-child(2) {
  width: 55%;
}
.content-block .block-detail .flex-table.ip_address_list_table th:nth-child(3),
.content-block .block-detail .flex-table.ip_address_list_table td:nth-child(3) {
  width: 5%;
  justify-content: center;
}
.content-block .block-detail .flex-table.ip_address_list_table th:nth-child(3) .icon,
.content-block .block-detail .flex-table.ip_address_list_table td:nth-child(3) .icon {
  cursor: pointer;
}
.content-block .block-detail .flex-table.ip_address_list_table th input[type=text],
.content-block .block-detail .flex-table.ip_address_list_table td input[type=text] {
  width: 100%;
}
.content-block .block-detail .flex-table.ip_address_list_table th input[type=text].error,
.content-block .block-detail .flex-table.ip_address_list_table td input[type=text].error {
  border: solid 1px #C61616;
  background-color: #ffecec;
}
.content-block .block-detail .flex-table.ip_address_list_table th input[type=text].example,
.content-block .block-detail .flex-table.ip_address_list_table td input[type=text].example {
  color: #666666;
}
.content-block .block-detail .flex-table.custom_alert_table th:nth-child(1),
.content-block .block-detail .flex-table.custom_alert_table td:nth-child(1) {
  width: 15%;
}
.content-block .block-detail .flex-table.custom_alert_table th:nth-child(2),
.content-block .block-detail .flex-table.custom_alert_table td:nth-child(2) {
  width: 33%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  flex-wrap: wrap;
}
.content-block .block-detail .flex-table.custom_alert_table th:nth-child(3),
.content-block .block-detail .flex-table.custom_alert_table td:nth-child(3) {
  width: 10%;
}
.content-block .block-detail .flex-table.custom_alert_table th:nth-child(3) p,
.content-block .block-detail .flex-table.custom_alert_table td:nth-child(3) p {
  margin: 0;
}
.content-block .block-detail .flex-table.custom_alert_table th:nth-child(4),
.content-block .block-detail .flex-table.custom_alert_table td:nth-child(4) {
  width: 12%;
}
.content-block .block-detail .flex-table.custom_alert_table th:nth-child(5),
.content-block .block-detail .flex-table.custom_alert_table td:nth-child(5) {
  width: 12%;
}
.content-block .block-detail .flex-table.custom_alert_table th:nth-child(6),
.content-block .block-detail .flex-table.custom_alert_table td:nth-child(6) {
  width: 7%;
  justify-content: center;
}
.content-block .block-detail .flex-table.custom_alert_table th:nth-child(7),
.content-block .block-detail .flex-table.custom_alert_table td:nth-child(7) {
  width: 7%;
  justify-content: center;
}
.content-block .block-detail .flex-table.custom_alert_table th:nth-child(8),
.content-block .block-detail .flex-table.custom_alert_table td:nth-child(8) {
  width: 4%;
  justify-content: center;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions,
.content-block .block-detail .flex-table.custom_alert_table td .conditions {
  width: 100%;
  display: flex;
  padding: 8px 16px 8px 0px;
  align-items: center;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name {
  width: 50%;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p {
  display: inline;
  margin: 0;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.start_time,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.start_time {
  background-color: #BFEEEF;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.end_time,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.end_time {
  background-color: #BADCFB;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.working_time,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.working_time {
  background-color: #C0F5E0;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.active_time,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.active_time {
  background-color: #D4CFEE;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.not_active_time,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.not_active_time {
  background-color: #FBE7BE;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.biz_point,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.biz_point {
  background-color: #F7C9CF;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.biz_point_hour,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.biz_point_hour {
  background-color: #CACDD6;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.category_time,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.category_time {
  background-color: #BAC8F7;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.category_biz_point,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.category_biz_point {
  background-color: #BAC8F7;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.application_time,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.application_time {
  background-color: #D1C5B1;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.application_biz_point,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.application_biz_point {
  background-color: #D1C5B1;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.attendance_schedule_start_time,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.attendance_schedule_start_time {
  background-color: #ff6347;
  color: #FFFFFF;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.attendance_schedule_end_time,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.attendance_schedule_end_time {
  background-color: #ff6347;
  color: #FFFFFF;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.attendance_schedule_work_time,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.attendance_schedule_work_time {
  background-color: #ff6347;
  color: #FFFFFF;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.attendance_schedule,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.attendance_schedule {
  background-color: #ff6347;
  color: #FFFFFF;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.attendance_record_start_time,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.attendance_record_start_time {
  background-color: #191970;
  color: #FFFFFF;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.attendance_record_end_time,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.attendance_record_end_time {
  background-color: #191970;
  color: #FFFFFF;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.attendance_record_work_time,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.attendance_record_work_time {
  background-color: #191970;
  color: #FFFFFF;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name p.attendance_record,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name p.attendance_record {
  background-color: #191970;
  color: #FFFFFF;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_name .target,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_name .target {
  font-size: 12px;
  margin-top: 4px;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_detail,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_detail {
  width: 12%;
  text-align: right;
}
.content-block .block-detail .flex-table.custom_alert_table th .conditions .condition_type,
.content-block .block-detail .flex-table.custom_alert_table td .conditions .condition_type {
  width: 38%;
  padding-left: 8px;
}
.content-block .block-detail .flex-table.custom_alert_table th.started,
.content-block .block-detail .flex-table.custom_alert_table td.started {
  color: #0D9554;
}
.content-block .block-detail .flex-table.custom_alert_table th.stopped,
.content-block .block-detail .flex-table.custom_alert_table td.stopped {
  color: #C61616;
}
.content-block .block-detail .flex-table.custom_alert_table th .other,
.content-block .block-detail .flex-table.custom_alert_table td .other {
  cursor: pointer;
  text-decoration: dashed underline;
  color: #999999;
}
.content-block .block-detail .flex-table.custom_alert_table tr.stopped .conditions .condition_name p {
  background-color: #BFC4C9;
  color: #EEEEEE;
}
.content-block .block-detail .member_area {
  background-color: #f5f2f2;
  border-radius: 0px 0px 6px 6px;
  padding: 24px;
  margin: 0px -48px -48px;
}
.content-block .block-detail .member_area .title {
  font-size: 22px;
  color: #666666;
  padding: 0px 8px 16px;
}
.content-block.wordcloud .block-header {
  margin: -8px -8px 24px;
}
.content-block.wordcloud .block-header .title {
  font-size: 24px;
  color: #666666;
}
.content-block.wordcloud .block-detail .wordcloud_image {
  width: 100%;
  margin: 0 auto;
}
.content-block:last-child {
  border-bottom: none;
}
.content-block .custom_alert_button {
  display: flex;
  margin: 0 0 24px 0;
  justify-content: flex-end;
  position: relative;
}
.content-block .custom_alert_button .group_button {
  background-color: #4472ba;
  border: 1px solid #4472ba;
  color: #ffffff;
  border-radius: 4px;
  width: fit-content;
  cursor: pointer;
  display: flex;
  align-items: center;
}
.content-block .custom_alert_button .group_button .main_contents {
  display: flex;
  align-items: center;
  gap: 8px;
}
.content-block .custom_alert_button .group_button .main_contents:hover {
  background-color: #FFFFFF0d;
}
.content-block .custom_alert_button .group_button .separator {
  width: 1px;
  height: 24px;
  background-color: #223d68;
}
.content-block .custom_alert_button .group_list {
  position: absolute;
  top: 30px;
  z-index: 2004;
  background-color: #ffffff;
  border-radius: 4px;
  padding: 4px;
  display: flex;
  flex-flow: column;
  gap: 4px;
}
.content-block .custom_alert_button .group_list > button {
  display: flex;
  align-items: center;
  gap: 8px;
}
.content-block .custom_alert_button .group_list > button:hover {
  color: #52a7dd;
  background-color: #f0f8ff;
}

@keyframes rotation-frame {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes modal_slide_in {
  0% {
    opacity: 0;
    transform: translateX(0%) translateY(-100%);
    -ms-transform: translateX(0%) translateY(-100%);
  }
  100% {
    opacity: 1;
    transform: translateX(0%) translateY(-20px);
    -ms-transform: translateX(0%) translateY(-20px);
  }
}
@keyframes confirmation_modal_slide_in {
  0% {
    opacity: 0;
    transform: translateX(0%) translateY(-100%);
    -ms-transform: translateX(0%) translateY(-100%);
  }
  100% {
    opacity: 1;
    transform: translateX(0%) translateY(0%);
    -ms-transform: translateX(0%) translateY(0%);
  }
}
.setting_page .button_area {
  display: flex;
  align-items: center;
  gap: 8px;
}
.setting_page .button_area .button {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  min-width: 200px;
  background-color: #4472ba;
  border: 1px solid #4472ba;
  color: #ffffff;
  padding: 8px 12px;
  border-radius: 4px;
}
.setting_page .button_area .button:hover {
  opacity: 0.9;
}
.setting_page .button_area .button:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}
.setting_page .button_area .button.cancel {
  background-color: #666666;
  border: solid 1px #666666;
}
.setting_page .button_area button.reload {
  margin: 0;
}
.setting_page .modal-keyword-search {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.setting_page .modal-flex-table {
  display: inline-table;
  width: 100%;
  table-layout: fixed;
  border: 1px solid #CCCCCC;
}
.setting_page .modal-flex-table thead {
  color: #333333;
  border-bottom: 1px solid #D5DADF;
}
.setting_page .modal-flex-table thead tr,
.setting_page .modal-flex-table tbody tr {
  display: flex;
  min-height: 50px;
}
.setting_page .modal-flex-table thead tr:nth-child(2n),
.setting_page .modal-flex-table tbody tr:nth-child(2n) {
  background-color: #F5F5F5;
}
.setting_page .modal-flex-table thead tr th,
.setting_page .modal-flex-table thead tr td,
.setting_page .modal-flex-table tbody tr th,
.setting_page .modal-flex-table tbody tr td {
  display: flex;
  padding: 0.5em;
  align-items: center;
}
.setting_page .modal-flex-table.admin tbody {
  max-height: 300px;
  display: block;
  overflow-y: auto;
}
.setting_page .modal-flex-table.admin tr.disable {
  color: #CCCCCC;
}
.setting_page .modal-flex-table.admin th,
.setting_page .modal-flex-table.admin td {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.setting_page .modal-flex-table.admin th:nth-child(1),
.setting_page .modal-flex-table.admin td:nth-child(1) {
  width: 10%;
  justify-content: center;
}
.setting_page .modal-flex-table.admin th:nth-child(2),
.setting_page .modal-flex-table.admin td:nth-child(2) {
  width: 40%;
}
.setting_page .modal-flex-table.admin th:nth-child(3),
.setting_page .modal-flex-table.admin td:nth-child(3) {
  width: 40%;
}
.setting_page .modal-flex-table.admin input[type=checkbox] {
  margin: 0 !important;
}
.setting_page .category_title {
  font-size: 22px;
  padding: 8px 0;
  margin-bottom: 16px;
}
.setting_page .card_area {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 40px;
}
.setting_page .card_area .card_block {
  width: 24%;
  border: solid 1px #CCC;
  border-radius: 4px;
  margin-bottom: 1%;
  padding: 16px;
  color: #666;
  position: relative;
  display: flex;
  flex-direction: column;
}
.setting_page .card_area .card_block .title {
  padding: 8px;
  border-bottom: solid 1px #CCC;
  margin: -16px -16px 16px;
  font-size: 20px;
  border-radius: 4px 4px 0 0;
  background-color: #EEE;
}
.setting_page .card_area .card_block .description {
  font-size: 14px;
  margin-bottom: 16px;
}
.setting_page .card_area .card_block .content {
  display: flex;
  margin-bottom: 8px;
}
.setting_page .card_area .card_block .button {
  border-radius: 4px;
  width: 100%;
  text-align: center;
  margin-top: auto;
  background-color: #337ab7;
  border: 1px solid #2e6da4;
  color: #FFF;
  padding: 10px;
}
.setting_page .card_area .card_block .button.delete {
  background-color: #C61616;
  border: 1px solid #C61616;
}
.setting_page .card_area::before, .setting_page .card_area::after {
  content: "";
  display: block;
  width: 24%;
}
.setting_page .card_area::before {
  order: 1;
}
.setting_page .card_area:last-of-type {
  margin-bottom: 0;
}
.setting_page .profile_image {
  position: relative;
  min-height: 100px;
  max-width: 165px;
  width: 100%;
  margin: 8px auto 16px;
}
.setting_page .profile_image img {
  border: 1px solid #ECF0F5;
  border-radius: 50%;
  max-width: 165px;
  cursor: pointer;
  width: 100%;
}
.setting_page .profile_image .icon svg {
  width: 100px;
  height: 100px;
}
.setting_page .profile_image_delete {
  margin-top: 8px;
  cursor: pointer;
  font-size: 12px;
  color: #4a7ecd;
}
.setting_page .flex_box {
  display: flex;
}
.setting_page .flex_box .w20 {
  width: 20%;
}
.setting_page .flex_box .w80 {
  width: 80%;
}
.setting_page .flex_box .center {
  text-align: center;
}
.setting_page .flex_box button {
  border-radius: 4px;
  text-align: center;
  background-color: #337ab7;
  border: 1px solid #2e6da4;
  color: #FFF;
  padding: 10px;
}
.setting_page label {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 5px;
  font-weight: 700;
}
.setting_page .form-control {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
}
.setting_page .content-block {
  padding: 24px 0;
  border-bottom: 1px solid #D6DADE;
  margin: 0 24px;
}
.setting_page .content-block .reload {
  margin-right: 16px;
  display: inline-block;
  text-align: center;
  background-color: #EEEEEE;
  border: 1px solid #999999;
  padding: 6px 12px;
  border-radius: 4px;
}
.setting_page .content-block .reload:hover {
  background-color: #DDDDDD;
}
.setting_page .content-block .block-header {
  position: relative;
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.setting_page .content-block .block-header .title {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 8px;
}
.setting_page .content-block .block-header .member_summary {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 12px;
}
.setting_page .content-block .block-header .member_summary .active_count {
  font-size: 30px;
  font-weight: bold;
  margin: 0px 4px;
  color: #008001;
}
.setting_page .content-block .block-header .member_summary .inactive_count {
  font-size: 18px;
  font-weight: bold;
  margin: 0px 4px;
  color: #e44242;
}
.setting_page .content-block .block-header .member_summary .separator {
  font-size: 24px;
  font-weight: bold;
  color: #666666;
}
.setting_page .content-block .block-header .member_summary .limit_count {
  font-size: 18px;
  font-weight: bold;
  margin: 0px 4px;
  color: #666666;
}
.setting_page .content-block .block-header .description {
  font-size: 14px;
  color: #333333;
}
.setting_page .content-block .block-header .description p {
  margin: 0;
}
.setting_page .content-block .block-header.no_margin {
  margin-bottom: 0;
}
.setting_page .content-block .block-detail .plan {
  font-size: 28px;
  color: #4472BA;
}
.setting_page .content-block .block-detail .strong {
  font-weight: bold;
}
.setting_page .content-block .block-detail .description {
  font-size: 14px;
  color: #333333;
  margin-bottom: 16px;
}
.setting_page .content-block .block-detail .description.red_mini {
  margin-top: 8px;
  font-size: 12px;
  color: #FF0000;
  padding-top: 0;
}
.setting_page .content-block .block-detail .description.red_mini p {
  margin: 0;
}
.setting_page .content-block .block-detail .record-area {
  margin: 8px 0px;
  border-radius: 4px;
}
.setting_page .content-block .block-detail .record-area select {
  padding: 4px 8px;
  margin-left: 8px;
}
.setting_page .content-block .block-detail .qr_code {
  min-height: 200px;
}
.setting_page .content-block .block-detail .mfa_input {
  margin-bottom: 8px;
}
.setting_page .content-block .block-detail .mfa_input p {
  margin: 0;
}
.setting_page .content-block .block-detail .mfa_input input[type=text] {
  width: 100%;
  background-color: #EEEEEE;
  padding: 8px 16px;
  border: solid 1px #D6DADE;
  border-radius: 4px;
  outline: none;
  font-size: 14px;
  color: #333333;
}
.setting_page .content-block .block-detail.mfa input[type=text] {
  min-width: 250px;
  background-color: #FFFFFF;
  padding: 8px 16px;
  border: solid 1px #D6DADE;
  border-radius: 4px 0 0 4px;
  outline: none;
  margin-bottom: 8px;
}
.setting_page .content-block .block-detail.mfa .button {
  display: inline-block;
  text-align: center;
  min-width: 80px;
  background-color: #4472BA;
  border: 1px solid #4472BA;
  color: #FFFFFF;
  padding: 8px 12px;
  border-radius: 0 4px 4px 0;
  margin-bottom: 8px;
}
.setting_page .content-block .block-detail.mfa .button:hover {
  background-color: #094E8D;
  text-decoration: none;
}
.setting_page .content-block .block-detail.mfa .button:disabled {
  opacity: 0.5;
}
.setting_page .content-block .block-detail.mfa .button:disabled:hover {
  background-color: #4472BA;
  text-decoration: none;
}
.setting_page .content-block .block-detail .button {
  display: inline-block;
  text-align: center;
  min-width: 200px;
  background-color: #4472BA;
  border: 1px solid #4472BA;
  color: #FFFFFF;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 14px;
}
.setting_page .content-block .block-detail .button:hover {
  background-color: #094E8D;
  text-decoration: none;
}
.setting_page .content-block .block-detail .button:disabled {
  opacity: 0.5;
}
.setting_page .content-block .block-detail .button:disabled:hover {
  background-color: #4472BA;
  text-decoration: none;
}
.setting_page .content-block .block-detail .button.delete {
  background-color: #C61616;
  border: 1px solid #C61616;
  color: #FFFFFF;
}
.setting_page .content-block .block-detail .button.delete:hover {
  background-color: #d75b5b;
  color: #FFFFFF;
}
.setting_page .content-block .block-detail .button.delete:focus {
  outline: none;
}
.setting_page .content-block .block-detail .button.delete:disabled {
  cursor: not-allowed;
}
.setting_page .content-block .block-detail .toggle_switch {
  position: relative;
  width: 112px;
  height: 34px;
}
.setting_page .content-block .block-detail .toggle_switch .toggle_label {
  width: 112px;
  height: 34px;
  background: #d5dadf;
  position: relative;
  display: inline-block;
  border-radius: 6px;
  transition: 0.4s;
  box-sizing: border-box;
}
.setting_page .content-block .block-detail .toggle_switch .toggle_label .toggle_left {
  position: absolute;
  top: 7px;
  left: 25%;
  transform: translateX(-50%);
  z-index: 10;
  color: #FFFFFF;
  font-weight: normal;
  font-size: 14px;
  pointer-events: none;
}
.setting_page .content-block .block-detail .toggle_switch .toggle_label .toggle_right {
  position: absolute;
  top: 7px;
  right: 25%;
  transform: translateX(50%);
  z-index: 10;
  color: #92999E;
  font-weight: normal;
  font-size: 14px;
  pointer-events: none;
}
.setting_page .content-block .block-detail .toggle_switch .toggle_label .back_ground {
  content: "";
  position: absolute;
  width: 55px;
  height: 30px;
  border-radius: 6px;
  left: 2px;
  top: 2px;
  z-index: 2;
  background: #4472BA;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  transition: 0.4s;
}
.setting_page .content-block .block-detail .toggle_switch .toggle_label .toggle_input {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  opacity: 0;
  cursor: pointer;
}
.setting_page .content-block .block-detail .toggle_switch .toggle_label .toggle_input:checked ~ .toggle_left {
  color: #92999E;
}
.setting_page .content-block .block-detail .toggle_switch .toggle_label .toggle_input:checked ~ .toggle_right {
  color: #FFFFFF;
}
.setting_page .content-block .block-detail .toggle_switch .toggle_label .toggle_input:checked ~ .back_ground {
  left: 55px;
  width: 55px;
  background-color: #333333;
}
.setting_page .content-block .block-detail .flex-table {
  display: inline-table;
  width: 100%;
  table-layout: fixed;
}
.setting_page .content-block .block-detail .flex-table thead {
  color: #333333;
  border-bottom: 1px solid #D5DADF;
}
.setting_page .content-block .block-detail .flex-table thead tr,
.setting_page .content-block .block-detail .flex-table tbody tr {
  display: flex;
  min-height: 50px;
  padding: 0 16px;
}
.setting_page .content-block .block-detail .flex-table thead tr:nth-child(2n),
.setting_page .content-block .block-detail .flex-table tbody tr:nth-child(2n) {
  background-color: #F5F5F5;
}
.setting_page .content-block .block-detail .flex-table thead tr th,
.setting_page .content-block .block-detail .flex-table thead tr td,
.setting_page .content-block .block-detail .flex-table tbody tr th,
.setting_page .content-block .block-detail .flex-table tbody tr td {
  display: flex;
  padding: 0.5em;
  align-items: center;
}
.setting_page .content-block .block-detail .flex-table thead tr th button,
.setting_page .content-block .block-detail .flex-table thead tr td button,
.setting_page .content-block .block-detail .flex-table tbody tr th button,
.setting_page .content-block .block-detail .flex-table tbody tr td button {
  min-width: auto;
}
.setting_page .content-block .block-detail .flex-table thead tr th button.update,
.setting_page .content-block .block-detail .flex-table thead tr td button.update,
.setting_page .content-block .block-detail .flex-table tbody tr th button.update,
.setting_page .content-block .block-detail .flex-table tbody tr td button.update {
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  border-radius: 4px;
  padding: 4px 16px;
  color: #656E73;
}
.setting_page .content-block .block-detail .flex-table thead tr th button.update:hover,
.setting_page .content-block .block-detail .flex-table thead tr td button.update:hover,
.setting_page .content-block .block-detail .flex-table tbody tr th button.update:hover,
.setting_page .content-block .block-detail .flex-table tbody tr td button.update:hover {
  background-color: #656E73;
  color: #FFFFFF;
}
.setting_page .content-block .block-detail .flex-table thead tr th button.update:focus,
.setting_page .content-block .block-detail .flex-table thead tr td button.update:focus,
.setting_page .content-block .block-detail .flex-table tbody tr th button.update:focus,
.setting_page .content-block .block-detail .flex-table tbody tr td button.update:focus {
  outline: none;
}
.setting_page .content-block .block-detail .flex-table thead tr th button.update:disabled,
.setting_page .content-block .block-detail .flex-table thead tr td button.update:disabled,
.setting_page .content-block .block-detail .flex-table tbody tr th button.update:disabled,
.setting_page .content-block .block-detail .flex-table tbody tr td button.update:disabled {
  color: #d0d3d5;
  border: 1px solid #d0d3d5;
  background-color: #FFFFFF;
}
.setting_page .content-block .block-detail .flex-table thead tr th button.delete,
.setting_page .content-block .block-detail .flex-table thead tr td button.delete,
.setting_page .content-block .block-detail .flex-table tbody tr th button.delete,
.setting_page .content-block .block-detail .flex-table tbody tr td button.delete {
  background-color: #C61616;
  border: 1px solid #C61616;
  color: #FFFFFF;
}
.setting_page .content-block .block-detail .flex-table thead tr th button.delete:hover,
.setting_page .content-block .block-detail .flex-table thead tr td button.delete:hover,
.setting_page .content-block .block-detail .flex-table tbody tr th button.delete:hover,
.setting_page .content-block .block-detail .flex-table tbody tr td button.delete:hover {
  background-color: #d75b5b;
  color: #FFFFFF;
}
.setting_page .content-block .block-detail .flex-table thead tr th button.delete:focus,
.setting_page .content-block .block-detail .flex-table thead tr td button.delete:focus,
.setting_page .content-block .block-detail .flex-table tbody tr th button.delete:focus,
.setting_page .content-block .block-detail .flex-table tbody tr td button.delete:focus {
  outline: none;
}
.setting_page .content-block .block-detail .flex-table thead tr th button.mini_menu_button,
.setting_page .content-block .block-detail .flex-table thead tr td button.mini_menu_button,
.setting_page .content-block .block-detail .flex-table tbody tr th button.mini_menu_button,
.setting_page .content-block .block-detail .flex-table tbody tr td button.mini_menu_button {
  background-color: transparent;
  border: none;
}
.setting_page .content-block .block-detail .flex-table thead tr th button.mini_menu_button:focus,
.setting_page .content-block .block-detail .flex-table thead tr td button.mini_menu_button:focus,
.setting_page .content-block .block-detail .flex-table tbody tr th button.mini_menu_button:focus,
.setting_page .content-block .block-detail .flex-table tbody tr td button.mini_menu_button:focus {
  outline: none;
}
.setting_page .content-block .block-detail .flex-table thead tr th button.flex,
.setting_page .content-block .block-detail .flex-table thead tr td button.flex,
.setting_page .content-block .block-detail .flex-table tbody tr th button.flex,
.setting_page .content-block .block-detail .flex-table tbody tr td button.flex {
  display: flex;
  align-items: center;
}
.setting_page .content-block .block-detail .flex-table thead tr th .title,
.setting_page .content-block .block-detail .flex-table thead tr td .title,
.setting_page .content-block .block-detail .flex-table tbody tr th .title,
.setting_page .content-block .block-detail .flex-table tbody tr td .title {
  color: #4472BA;
  cursor: pointer;
}
.setting_page .content-block .block-detail .flex-table thead tr th .title:hover,
.setting_page .content-block .block-detail .flex-table thead tr td .title:hover,
.setting_page .content-block .block-detail .flex-table tbody tr th .title:hover,
.setting_page .content-block .block-detail .flex-table tbody tr td .title:hover {
  text-decoration: underline;
}
.setting_page .content-block .block-detail .flex-table thead tr th .icon,
.setting_page .content-block .block-detail .flex-table thead tr td .icon,
.setting_page .content-block .block-detail .flex-table tbody tr th .icon,
.setting_page .content-block .block-detail .flex-table tbody tr td .icon {
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.setting_page .content-block .block-detail .flex-table thead tr th.no_data,
.setting_page .content-block .block-detail .flex-table thead tr td.no_data,
.setting_page .content-block .block-detail .flex-table tbody tr th.no_data,
.setting_page .content-block .block-detail .flex-table tbody tr td.no_data {
  width: 100% !important;
  height: 300px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  flex-wrap: wrap;
}
.setting_page .content-block .block-detail .flex-table thead tr th.no_data .text,
.setting_page .content-block .block-detail .flex-table thead tr td.no_data .text,
.setting_page .content-block .block-detail .flex-table tbody tr th.no_data .text,
.setting_page .content-block .block-detail .flex-table tbody tr td.no_data .text {
  font-size: 30px;
  color: #CCCCCC;
  margin-bottom: 16px;
}
.setting_page .content-block .block-detail .flex-table thead tr th .generating,
.setting_page .content-block .block-detail .flex-table thead tr td .generating,
.setting_page .content-block .block-detail .flex-table tbody tr th .generating,
.setting_page .content-block .block-detail .flex-table tbody tr td .generating {
  color: #fd6a6a;
  font-weight: bold;
}
.setting_page .content-block .block-detail .flex-table thead tr.stopped,
.setting_page .content-block .block-detail .flex-table tbody tr.stopped {
  color: #BFC4C9;
}
.setting_page .content-block .block-detail .flex-table thead tr.stopped .title,
.setting_page .content-block .block-detail .flex-table tbody tr.stopped .title {
  color: #BFC4C9;
  cursor: default;
}
.setting_page .content-block .block-detail .flex-table thead tr.stopped .title:hover,
.setting_page .content-block .block-detail .flex-table tbody tr.stopped .title:hover {
  text-decoration: none;
}
.setting_page .content-block .block-detail .flex-table.member_table th,
.setting_page .content-block .block-detail .flex-table.member_table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.setting_page .content-block .block-detail .flex-table.member_table th:nth-child(1),
.setting_page .content-block .block-detail .flex-table.member_table td:nth-child(1) {
  width: 5%;
}
.setting_page .content-block .block-detail .flex-table.member_table th:nth-child(2),
.setting_page .content-block .block-detail .flex-table.member_table td:nth-child(2) {
  width: 25%;
}
.setting_page .content-block .block-detail .flex-table.member_table th:nth-child(2) .link,
.setting_page .content-block .block-detail .flex-table.member_table td:nth-child(2) .link {
  color: #4472BA;
  cursor: pointer;
}
.setting_page .content-block .block-detail .flex-table.member_table th:nth-child(2) .link:hover,
.setting_page .content-block .block-detail .flex-table.member_table td:nth-child(2) .link:hover {
  text-decoration: underline;
}
.setting_page .content-block .block-detail .flex-table.member_table th:nth-child(3),
.setting_page .content-block .block-detail .flex-table.member_table td:nth-child(3) {
  width: 25%;
}
.setting_page .content-block .block-detail .flex-table.member_table th:nth-child(4),
.setting_page .content-block .block-detail .flex-table.member_table td:nth-child(4) {
  width: 20%;
}
.setting_page .content-block .block-detail .flex-table.member_table th:nth-child(5),
.setting_page .content-block .block-detail .flex-table.member_table td:nth-child(5) {
  width: 25%;
}
.setting_page .content-block .block-detail .flex-table.export_csv_table th,
.setting_page .content-block .block-detail .flex-table.export_csv_table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.setting_page .content-block .block-detail .flex-table.export_csv_table th:nth-child(1),
.setting_page .content-block .block-detail .flex-table.export_csv_table td:nth-child(1) {
  width: 20%;
}
.setting_page .content-block .block-detail .flex-table.export_csv_table th:nth-child(2),
.setting_page .content-block .block-detail .flex-table.export_csv_table td:nth-child(2) {
  width: 20%;
}
.setting_page .content-block .block-detail .flex-table.export_csv_table th:nth-child(3),
.setting_page .content-block .block-detail .flex-table.export_csv_table td:nth-child(3) {
  width: 20%;
}
.setting_page .content-block .block-detail .flex-table.export_csv_table th:nth-child(4),
.setting_page .content-block .block-detail .flex-table.export_csv_table td:nth-child(4) {
  width: 20%;
}
.setting_page .content-block .block-detail .flex-table.export_csv_table th:nth-child(5),
.setting_page .content-block .block-detail .flex-table.export_csv_table td:nth-child(5) {
  width: 20%;
}
.setting_page .content-block .block-detail .flex-table.export_data_table th,
.setting_page .content-block .block-detail .flex-table.export_data_table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.setting_page .content-block .block-detail .flex-table.export_data_table th:nth-child(1),
.setting_page .content-block .block-detail .flex-table.export_data_table td:nth-child(1) {
  width: 20%;
}
.setting_page .content-block .block-detail .flex-table.export_data_table th:nth-child(2),
.setting_page .content-block .block-detail .flex-table.export_data_table td:nth-child(2) {
  width: 40%;
}
.setting_page .content-block .block-detail .flex-table.export_data_table th:nth-child(3),
.setting_page .content-block .block-detail .flex-table.export_data_table td:nth-child(3) {
  width: 20%;
}
.setting_page .content-block .block-detail .flex-table.export_data_table th:nth-child(4),
.setting_page .content-block .block-detail .flex-table.export_data_table td:nth-child(4) {
  width: 20%;
}
.setting_page .content-block .block-detail .flex-table.member_list_table tr.inactive {
  color: #999999;
  background-color: #ecf0ff;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th,
.setting_page .content-block .block-detail .flex-table.member_list_table td {
  word-break: break-all;
  word-wrap: break-word;
  overflow-wrap: break-word;
  justify-content: center;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(1),
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(1) {
  width: 20%;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(1) > div,
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(1) > div {
  display: flex;
  align-items: center;
  justify-content: center;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(1) > div > div,
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(1) > div > div {
  position: relative;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(1) > div > div button,
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(1) > div > div button {
  font-size: 20px;
  color: #666666;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(1) > div > div button.del,
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(1) > div > div button.del {
  color: #E44242;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(1) > div > div button.green,
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(1) > div > div button.green {
  color: #008000;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(2),
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(2) {
  width: 20%;
  display: flex;
  gap: 10px;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(3),
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(3) {
  width: 20%;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(4),
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(4) {
  width: 15%;
  align-items: center;
  gap: 4px;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(5),
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(5) {
  width: 15%;
  justify-content: center;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(6),
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(6) {
  width: 10%;
  justify-content: center;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(6) .green,
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(6) .green {
  color: #0D9554;
  font-weight: bold;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(6) button,
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(6) button {
  font-size: 20px;
  color: #666666;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th:nth-child(6) button.del,
.setting_page .content-block .block-detail .flex-table.member_list_table td:nth-child(6) button.del {
  color: #E44242;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th .profile_icon,
.setting_page .content-block .block-detail .flex-table.member_list_table td .profile_icon {
  border-radius: 50%;
  width: 24px;
  height: 24px;
}
.setting_page .content-block .block-detail .flex-table.member_list_table th .sort_block,
.setting_page .content-block .block-detail .flex-table.member_list_table td .sort_block {
  display: flex;
  gap: 4px;
  cursor: pointer;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th,
.setting_page .content-block .block-detail .flex-table.team_list_table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th:nth-child(1),
.setting_page .content-block .block-detail .flex-table.team_list_table td:nth-child(1) {
  width: 10%;
  justify-content: center;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th:nth-child(1) > div,
.setting_page .content-block .block-detail .flex-table.team_list_table td:nth-child(1) > div {
  display: flex;
  align-items: center;
  justify-content: center;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th:nth-child(1) > div > div,
.setting_page .content-block .block-detail .flex-table.team_list_table td:nth-child(1) > div > div {
  position: relative;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th:nth-child(1) > div > div button,
.setting_page .content-block .block-detail .flex-table.team_list_table td:nth-child(1) > div > div button {
  font-size: 20px;
  color: #666666;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th:nth-child(1) > div > div button.del,
.setting_page .content-block .block-detail .flex-table.team_list_table td:nth-child(1) > div > div button.del {
  color: #E44242;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th:nth-child(2),
.setting_page .content-block .block-detail .flex-table.team_list_table td:nth-child(2) {
  width: 25%;
  display: grid !important;
  justify-content: center;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th:nth-child(3),
.setting_page .content-block .block-detail .flex-table.team_list_table td:nth-child(3) {
  width: 65%;
  display: grid !important;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th .mini_box,
.setting_page .content-block .block-detail .flex-table.team_list_table td .mini_box {
  border: 1px solid #cccccc;
  background-color: #ffffff;
  margin-bottom: 8px;
  padding-bottom: 8px;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th .mini_box .title,
.setting_page .content-block .block-detail .flex-table.team_list_table td .mini_box .title {
  padding: 8px;
  background-color: #eeeeee;
  margin-bottom: 8px;
  font-weight: normal;
  cursor: default;
  color: inherit;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th .mini_box .title:hover,
.setting_page .content-block .block-detail .flex-table.team_list_table td .mini_box .title:hover {
  text-decoration: none;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th .mini_box .detail,
.setting_page .content-block .block-detail .flex-table.team_list_table td .mini_box .detail {
  display: flex;
  padding: 4px 8px;
  flex-wrap: wrap;
  gap: 8px;
  min-height: unset;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th .mini_box .detail > div,
.setting_page .content-block .block-detail .flex-table.team_list_table td .mini_box .detail > div {
  background-color: #FFFFFF;
  border: solid 1px #CCCCCC;
  border-radius: 20px;
  padding: 4px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th .mini_box:nth-last-of-type(1),
.setting_page .content-block .block-detail .flex-table.team_list_table td .mini_box:nth-last-of-type(1) {
  margin-bottom: 0px;
}
.setting_page .content-block .block-detail .flex-table.team_list_table th {
  justify-content: center;
}
.setting_page .content-block .block-detail .flex-table.team_list_table .other {
  cursor: pointer;
  text-decoration: dashed underline;
  color: #999999;
}
.setting_page .content-block .block-detail .flex-table.admin_list_table th,
.setting_page .content-block .block-detail .flex-table.admin_list_table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.setting_page .content-block .block-detail .flex-table.admin_list_table th:nth-child(1),
.setting_page .content-block .block-detail .flex-table.admin_list_table td:nth-child(1) {
  width: 35%;
}
.setting_page .content-block .block-detail .flex-table.admin_list_table th:nth-child(2),
.setting_page .content-block .block-detail .flex-table.admin_list_table td:nth-child(2) {
  width: 35%;
}
.setting_page .content-block .block-detail .flex-table.admin_list_table th:nth-child(3),
.setting_page .content-block .block-detail .flex-table.admin_list_table td:nth-child(3) {
  width: 20%;
}
.setting_page .content-block .block-detail .flex-table.admin_list_table th:nth-child(4),
.setting_page .content-block .block-detail .flex-table.admin_list_table td:nth-child(4) {
  width: 10%;
  justify-content: center;
}
.setting_page .content-block .block-detail .flex-table.ip_address_list_table th,
.setting_page .content-block .block-detail .flex-table.ip_address_list_table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
  min-height: 60px;
}
.setting_page .content-block .block-detail .flex-table.ip_address_list_table th:nth-child(1),
.setting_page .content-block .block-detail .flex-table.ip_address_list_table td:nth-child(1) {
  width: 40%;
}
.setting_page .content-block .block-detail .flex-table.ip_address_list_table th:nth-child(2),
.setting_page .content-block .block-detail .flex-table.ip_address_list_table td:nth-child(2) {
  width: 55%;
}
.setting_page .content-block .block-detail .flex-table.ip_address_list_table th:nth-child(3),
.setting_page .content-block .block-detail .flex-table.ip_address_list_table td:nth-child(3) {
  width: 5%;
  justify-content: center;
}
.setting_page .content-block .block-detail .flex-table.ip_address_list_table th:nth-child(3) .icon,
.setting_page .content-block .block-detail .flex-table.ip_address_list_table td:nth-child(3) .icon {
  cursor: pointer;
}
.setting_page .content-block .block-detail .flex-table.ip_address_list_table th input[type=text],
.setting_page .content-block .block-detail .flex-table.ip_address_list_table td input[type=text] {
  width: 100%;
}
.setting_page .content-block .block-detail .flex-table.ip_address_list_table th input[type=text].error,
.setting_page .content-block .block-detail .flex-table.ip_address_list_table td input[type=text].error {
  border: solid 1px #C61616;
  background-color: #ffecec;
}
.setting_page .content-block .block-detail .flex-table.ip_address_list_table th input[type=text].example,
.setting_page .content-block .block-detail .flex-table.ip_address_list_table td input[type=text].example {
  color: #666666;
}
.setting_page .content-block .block-detail.api_connect .description {
  font-size: 12px;
}
.setting_page .content-block .block-detail.api_connect .description p {
  margin-bottom: 4px;
}
.setting_page .content-block .block-detail.api_connect .description p.red {
  color: #FF0000;
}
.setting_page .content-block .block-detail.api_connect .detail_block {
  margin-bottom: 24px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 16px;
}
.setting_page .content-block .block-detail.api_connect .detail_block .button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.setting_page .content-block .block-detail.api_connect .connected_member_area .header_area {
  display: flex;
  align-items: center;
}
.setting_page .content-block .block-detail.api_connect .connected_member_area .header_area .title_area {
  padding: 16px;
  font-size: 20px;
  font-weight: bold;
  color: #333333;
}
.setting_page .content-block .block-detail.api_connect .connected_member_area .member_list {
  max-height: 300px;
  overflow-y: scroll;
}
.setting_page .content-block .block-detail.api_connect .connected_member_area .member_list .member_row {
  display: flex;
  align-items: center;
  gap: 8px;
  border-bottom: 1px solid #eeeeee;
}
.setting_page .content-block .block-detail.api_connect .connected_member_area .member_list .member_row .row_block {
  width: 50%;
  padding: 8px;
}
.setting_page .content-block .block-detail.api_connect .connected_member_area .member_list .member_row .row_block.name_area {
  display: flex;
  align-items: center;
  gap: 8px;
}
.setting_page .content-block .block-detail.api_connect .connected_member_area .member_list .member_row .row_block.name_area .profile_icon {
  border-radius: 50%;
  width: 24px;
  height: 24px;
}
.setting_page .content-block:last-child {
  border-bottom: none;
}
.setting_page .mini_menu {
  display: block;
  background-color: #FFFFFF;
  border-radius: 8px;
  box-shadow: 0px 0px 5px #CCCCCC;
  border: 1px solid #CCCCCC;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999999;
  transform: translateX(-30%);
  min-width: 154px;
}
.setting_page .mini_menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.setting_page .mini_menu ul li {
  align-items: center;
  cursor: pointer;
}
.setting_page .mini_menu ul li:first-child {
  border-radius: 8px 8px 0 0;
}
.setting_page .mini_menu ul li:first-child button {
  border-radius: 8px 8px 0 0;
}
.setting_page .mini_menu ul li:last-child {
  border-radius: 0 0 8px 8px;
  color: #C61616;
}
.setting_page .mini_menu ul li:last-child button {
  border-radius: 0 0 8px 8px;
}
.setting_page .mini_menu ul li.red {
  color: #C61616;
}
.setting_page .mini_menu ul li.red .icon svg {
  fill: #C61616;
}
.setting_page .mini_menu ul li .icon {
  width: 24px;
  height: 24px;
  margin-right: 4px;
}
.setting_page .mini_menu ul li .icon svg g use {
  fill: currentColor;
}
.setting_page .mini_menu ul li:hover {
  background-color: #F5F5F5;
}
.setting_page .mini_menu ul li button {
  width: 100%;
  display: flex;
  align-items: center;
  padding: 8px 16px 8px 8px;
  background-color: transparent;
  border: none;
}
.setting_page .mini_menu ul li button:focus {
  outline: none;
}
.setting_page .mini_menu ul li button:disabled {
  background-color: #F5F5F5;
  color: #999999;
}
.setting_page .mini_menu.none {
  display: none;
}
.setting_page .table-bordered {
  border: 1px solid #ddd;
}
.setting_page .modal-add-team .modal-table-checkbox {
  width: 10%;
  text-align: center;
}
.setting_page .modal-add-team .modal-table-name {
  width: 30%;
}
.setting_page .modal-add-team .modal-table-name label {
  font-weight: normal;
  margin: 0;
}
.setting_page .modal-add-team .modal-table-mail {
  width: 99999px;
}
.setting_page .modal-add-team .modal-table-mail label {
  font-weight: normal;
  margin: 0;
}
.setting_page .ip_restriction_table_wrapper {
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  padding: 16px;
  margin-bottom: 16px;
}
.setting_page .ip_restriction_table_wrapper .add {
  color: #4472BA;
  cursor: pointer;
  display: inline-block;
  padding-top: 16px;
  margin-left: 16px;
}
.setting_page .ip_restriction_info {
  border: 1px solid #ff0000;
  border-radius: 4px;
  background-color: #ffe6e6;
  color: #ff0000;
  padding: 8px;
  margin: 16px 0px;
}
.setting_page .custom_alert .modal_body {
  padding: 32px;
  max-height: 420px;
  overflow: auto;
}
.setting_page .custom_alert .modal_body .chip {
  display: inline-block;
  position: relative;
  padding: 4px 8px 4px 8px;
  border-radius: 16px;
  margin: 2px 4px;
  font-size: 12px;
  z-index: 1220;
}
.setting_page .custom_alert .modal_body .chip .close_icon {
  margin-left: 8px;
  cursor: pointer;
}
.setting_page .custom_alert .modal_body .item {
  margin-bottom: 16px;
}
.setting_page .custom_alert .modal_body .item .title {
  margin-bottom: 8px;
  font-weight: bold;
}
.setting_page .custom_alert .modal_body .item .detail {
  min-height: 34px;
}
.setting_page .custom_alert .modal_body .item .detail input[type=text],
.setting_page .custom_alert .modal_body .item .detail input[type=number],
.setting_page .custom_alert .modal_body .item .detail select {
  padding: 8px 16px;
  border-radius: 4px;
}
.setting_page .custom_alert .modal_body .item .detail input[type=text]:focus,
.setting_page .custom_alert .modal_body .item .detail input[type=number]:focus,
.setting_page .custom_alert .modal_body .item .detail select:focus {
  outline: none;
}
.setting_page .custom_alert .modal_body .item .detail input[type=text]:focus,
.setting_page .custom_alert .modal_body .item .detail input[type=number]:focus {
  border: 2px solid #d8e3f4;
  background-color: #FFFFFF;
  padding: 6px 14px;
}
.setting_page .custom_alert .modal_body .item .detail input[type=checkbox] {
  margin-right: 4px;
}
.setting_page .custom_alert .modal_body .item .detail label {
  margin-bottom: 0;
}
.setting_page .custom_alert .modal_body .item .detail label + label {
  margin-left: 8px;
}
.setting_page .custom_alert .modal_body .item .detail + .detail {
  margin-top: 12px;
}
.setting_page .custom_alert .modal_body .item .detail .icon {
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.setting_page .custom_alert .modal_body .item .detail.equal_space {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.setting_page .custom_alert .modal_body .item .detail.row_1 input[type=text],
.setting_page .custom_alert .modal_body .item .detail.row_1 input[type=number],
.setting_page .custom_alert .modal_body .item .detail.row_1 select {
  width: 100%;
}
.setting_page .custom_alert .modal_body .item .detail.row_2 input[type=text],
.setting_page .custom_alert .modal_body .item .detail.row_2 input[type=number],
.setting_page .custom_alert .modal_body .item .detail.row_2 select {
  width: 49%;
}
.setting_page .custom_alert .modal_body .item .detail.row_3 input[type=text]:nth-child(1),
.setting_page .custom_alert .modal_body .item .detail.row_3 input[type=number]:nth-child(1),
.setting_page .custom_alert .modal_body .item .detail.row_3 select:nth-child(1) {
  width: 60%;
}
.setting_page .custom_alert .modal_body .item .detail.row_3 input[type=text]:nth-child(2),
.setting_page .custom_alert .modal_body .item .detail.row_3 input[type=number]:nth-child(2),
.setting_page .custom_alert .modal_body .item .detail.row_3 select:nth-child(2) {
  width: 20%;
}
.setting_page .custom_alert .modal_body .item .detail.row_3 input[type=text]:nth-child(3),
.setting_page .custom_alert .modal_body .item .detail.row_3 input[type=number]:nth-child(3),
.setting_page .custom_alert .modal_body .item .detail.row_3 select:nth-child(3) {
  width: 10%;
}
.setting_page .custom_alert .modal_body .item .detail.row_3 .spacer {
  width: 24px;
}
.setting_page .custom_alert .modal_body .item .detail.row_4 input[type=text]:nth-child(1),
.setting_page .custom_alert .modal_body .item .detail.row_4 input[type=number]:nth-child(1),
.setting_page .custom_alert .modal_body .item .detail.row_4 select:nth-child(1) {
  width: 32%;
}
.setting_page .custom_alert .modal_body .item .detail.row_4 input[type=text]:nth-child(2),
.setting_page .custom_alert .modal_body .item .detail.row_4 input[type=number]:nth-child(2),
.setting_page .custom_alert .modal_body .item .detail.row_4 select:nth-child(2) {
  width: 26%;
}
.setting_page .custom_alert .modal_body .item .detail.row_4 input[type=text]:nth-child(3),
.setting_page .custom_alert .modal_body .item .detail.row_4 input[type=number]:nth-child(3),
.setting_page .custom_alert .modal_body .item .detail.row_4 select:nth-child(3) {
  width: 20%;
}
.setting_page .custom_alert .modal_body .item .detail.row_4 input[type=text]:nth-child(4),
.setting_page .custom_alert .modal_body .item .detail.row_4 input[type=number]:nth-child(4),
.setting_page .custom_alert .modal_body .item .detail.row_4 select:nth-child(4) {
  width: 10%;
}
.setting_page .custom_alert .modal_body .item .detail.row_4 .spacer {
  width: 24px;
}
.setting_page .custom_alert .modal_body .item .detail.preset {
  display: flex;
  justify-content: space-around;
}
.setting_page .custom_alert .modal_body .item .detail.preset button {
  display: inline-block;
  text-align: center;
  width: 24%;
  padding: 6px 12px;
  border-radius: 4px;
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  color: #656E73;
}
.setting_page .custom_alert .modal_body .item .error {
  margin-top: 4px;
  margin-bottom: 4px;
  color: #C61616;
}
.setting_page .custom_alert .modal_body .item .add_conditions {
  display: inline-block;
  margin-top: 16px;
  color: #4472BA;
  cursor: pointer;
}
.setting_page .custom_alert .modal_body .item .conditions_item {
  width: 49%;
}
.setting_page .custom_alert .modal_body .item .slack_channel_item {
  width: 100%;
}
.setting_page .custom_alert .modal_body .item .select::after {
  border: none;
}
.setting_page .custom_alert .modal_body .item .conditions_item.select,
.setting_page .custom_alert .modal_body .item .slack_channel_item.select {
  width: 26%;
  z-index: 2004;
  position: unset;
  background-color: #FFFFFF;
}
.setting_page .custom_alert .modal_body .item .conditions_item .conditions_title,
.setting_page .custom_alert .modal_body .item .slack_channel_item .conditions_title {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 8px;
}
.setting_page .custom_alert .modal_body .item .conditions_item .conditions_title .reset,
.setting_page .custom_alert .modal_body .item .slack_channel_item .conditions_title .reset {
  font-size: 10px;
  cursor: pointer;
  color: #4572BA;
}
.setting_page .custom_alert .modal_body .item .conditions_item select,
.setting_page .custom_alert .modal_body .item .slack_channel_item select {
  width: 100%;
}
.setting_page .custom_alert .modal_body .item .conditions_item .selected_item,
.setting_page .custom_alert .modal_body .item .slack_channel_item .selected_item {
  border-radius: 4px;
  padding: 6px 8px;
  min-height: 35px;
  position: relative;
  border: solid 1px #CCCCCC;
}
.setting_page .custom_alert .modal_body .item .conditions_item .selected_item .modal_trigger,
.setting_page .custom_alert .modal_body .item .slack_channel_item .selected_item .modal_trigger {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: -6px -8px;
  z-index: 1;
}
.setting_page .custom_alert .modal_body .item .conditions_item .selected_item > p,
.setting_page .custom_alert .modal_body .item .slack_channel_item .selected_item > p {
  margin: 4px 0 0 10px;
}
.setting_page .custom_alert .modal_body .item .conditions_item .selected_item > .icon,
.setting_page .custom_alert .modal_body .item .slack_channel_item .selected_item > .icon {
  position: absolute;
  right: 10px;
  top: calc(50% - 6px);
  z-index: 0;
  transition: transform 0.3s ease;
  width: 9px;
  height: auto;
}
.setting_page .custom_alert .modal_body .item .conditions_item .selected_item > .icon.open,
.setting_page .custom_alert .modal_body .item .slack_channel_item .selected_item > .icon.open {
  transform: rotate(180deg);
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box {
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  padding: 16px;
  z-index: 1210;
  position: absolute;
  width: 100%;
  background-color: #FFFFFF;
  margin-top: 8px;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box.select,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box.select {
  width: 300px;
  z-index: 2230;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box.custom_alert_select,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box.custom_alert_select {
  width: 50%;
  top: 300px;
  z-index: 2230;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box.slack_channel_select,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box.slack_channel_select {
  width: 100%;
  top: 400px;
  z-index: 2230;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box.none,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box.none {
  display: none;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box .search_area,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box .search_area {
  position: relative;
  width: 100%;
  margin-bottom: 16px;
  background-color: #EEE;
  border: none;
  padding: 8px 8px;
  border-radius: 4px;
  font-size: 12px;
  display: flex;
  align-items: center;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box .search_area > .icon,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box .search_area > .icon {
  margin-right: 8px;
  width: 9px;
  height: auto;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box .search_area input[type=text],
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box .search_area input[type=text] {
  border: none;
  background-color: transparent;
  width: 100%;
  line-height: 1.4em;
  height: 20px;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box .search_area input[type=text]:focus,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box .search_area input[type=text]:focus {
  outline: none;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box .search_area .reset,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box .search_area .reset {
  position: absolute;
  right: 0;
  border: none;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box .select_list,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box .select_list {
  max-height: 250px;
  overflow: scroll;
  overflow-y: auto;
  overflow-x: unset;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box .select_row,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box .select_row {
  display: flex;
  align-items: flex-start;
  margin-bottom: 8px;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box .select_row.single,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box .select_row.single {
  padding: 4px;
  cursor: pointer;
  align-items: center;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box .select_row.single:hover,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box .select_row.single:hover {
  background-color: #ECF0F5;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box .select_row input[type=checkbox],
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box .select_row input[type=checkbox] {
  width: 18px;
  height: 18px;
  margin: 0 4px 0 0;
  border: 1px solid #CCC;
}
.setting_page .custom_alert .modal_body .item .conditions_item .select_box .select_row label,
.setting_page .custom_alert .modal_body .item .slack_channel_item .select_box .select_row label {
  font-weight: normal;
}
.setting_page .custom_alert .modal_body .pre_icon {
  margin-right: 4px;
}
.setting_page .custom_alert .modal_footer {
  display: flex;
  padding: 32px;
  border-top: 1px solid #A9AFB3;
  justify-content: space-between;
}
.setting_page .custom_alert .modal_footer button {
  display: inline-block;
  text-align: center;
  width: 49%;
  background-color: #4472BA;
  border: 1px solid #4472BA;
  color: #FFFFFF;
  padding: 6px 12px;
  border-radius: 4px;
}
.setting_page .custom_alert .modal_footer button:hover {
  background-color: #094E8D;
  text-decoration: none;
}
.setting_page .custom_alert .modal_footer button:focus {
  outline: none;
}
.setting_page .custom_alert .modal_footer button.cancel {
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  color: #656E73;
}
.setting_page .custom_alert .modal_footer button.cancel:hover {
  background-color: #92999E;
  color: #FFFFFF;
}
.setting_page.csv_import .block-base {
  padding-left: 8px;
  letter-spacing: 0.17px;
}
.setting_page.csv_import .text-center {
  text-align: center;
}
.setting_page.csv_import .step-title {
  padding-top: 8px;
  font-size: 20px;
  font-weight: bold;
}
.setting_page.csv_import .step-body-start {
  padding-top: 32px;
}
.setting_page.csv_import .stepBar {
  display: flex;
  max-width: 800px;
  position: relative;
  margin: 20px auto;
  text-align: center;
}
.setting_page.csv_import .stepBar li {
  list-style: none;
  position: relative;
  width: 33.333%;
}
.setting_page.csv_import .stepBar li::after {
  background: #A8AFB4;
  content: "";
  width: calc(100% - 48px);
  height: 1px;
  position: absolute;
  left: calc(-50% + 24px);
  top: 16px;
}
.setting_page.csv_import .stepBar li:first-child::after {
  display: none;
}
.setting_page.csv_import .stepBar li span {
  color: #D5DADF;
  display: inline-block;
  height: 32px;
  margin-bottom: 16px;
  line-height: 32px;
  width: 32px;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  border: 1px solid #D5DADF;
  font-size: 20px;
}
.setting_page.csv_import .stepBar li span.check {
  background-color: #4472BA;
  color: #FFFFFF;
  border: 1px solid #4472BA;
}
.setting_page.csv_import .stepBar li span.active {
  color: #4472BA;
  border: 1px solid #4472BA;
}
.setting_page.csv_import .stepBar li p {
  color: #D5DADF;
  font-weight: bold;
}
.setting_page.csv_import .stepBar li p.active {
  color: #333333;
}
.setting_page.csv_import .step1-image-area {
  width: 100%;
  padding-top: 80px;
}
.setting_page.csv_import .step1-image-area .text {
  font-size: 1vw;
  text-align: center;
  font-weight: bold;
}
.setting_page.csv_import .step1 {
  display: flex;
  position: relative;
  margin: 0px;
  text-align: center;
  padding: 0px;
}
.setting_page.csv_import .step1 li {
  list-style: none;
  position: relative;
  width: 33.333%;
  margin: 0px 4%;
}
.setting_page.csv_import .step1 li.second::before {
  border-bottom: 4px dashed #A8AFB4;
  content: "";
  width: 21%;
  height: 1px;
  position: absolute;
  left: -30%;
  top: 45%;
}
.setting_page.csv_import .step1 li.third::before {
  border-bottom: 4px dashed #A8AFB4;
  content: "";
  width: 21%;
  height: 1px;
  position: absolute;
  left: -23%;
  top: 45%;
}
.setting_page.csv_import button {
  text-align: center;
}
.setting_page.csv_import button.margin {
  margin-left: 24px;
}
.setting_page.csv_import button.link-style-btn {
  outline: none;
  cursor: pointer;
  border: none;
  background: none;
  color: #0033cc;
  display: flex;
  align-items: center;
}
.setting_page.csv_import button.link-style-btn:hover {
  text-decoration: underline;
  color: #002080;
  background-color: #ECF0F5;
}
.setting_page.csv_import button.link-style-btn .text {
  vertical-align: super;
}
.setting_page.csv_import button.link-style-btn .font-black {
  color: #333333;
}
.setting_page.csv_import button.upload {
  width: 220px;
  height: 40px;
  background-color: #4472BA;
  border: 0px;
  border-radius: 4px;
  color: #FFFFFF;
}
.setting_page.csv_import button.upload:hover {
  background-color: #094E8D;
  text-decoration: none;
}
.setting_page.csv_import button.upload .loading_mini {
  display: inline-block;
  width: 14px;
  height: 14px;
  border: 3px solid #FFFFFF;
  border-image: initial;
  border-radius: 50%;
  border-right-color: transparent;
  animation: rotation-frame 0.75s linear infinite;
}
.setting_page.csv_import button.cancel {
  width: 220px;
  height: 40px;
  background-color: #FFFFFF;
  border-radius: 4px;
  border: solid 1px #CCC;
}
.setting_page.csv_import button.cancel:hover {
  background-color: #92999E;
  color: #FFFFFF;
}
.setting_page.csv_import button.modal_cancel {
  width: 49%;
  height: 40px;
  background-color: #FFFFFF;
  border-radius: 4px;
  border: solid 1px #CCC;
}
.setting_page.csv_import button.modal_cancel:hover {
  background-color: #92999E;
  color: #FFFFFF;
}
.setting_page.csv_import button.start-btn {
  width: 360px;
  height: 40px;
  background-color: #4472BA;
  border: 0px;
  border-radius: 4px;
  color: #FFFFFF;
}
.setting_page.csv_import button.start-btn:hover {
  background-color: #094E8D;
  text-decoration: none;
}
.setting_page.csv_import .encode .title {
  font-weight: bold;
}
.setting_page.csv_import .encode .description {
  padding-left: 8px;
}
.setting_page.csv_import .precautions {
  color: #4E585D;
}
.setting_page.csv_import .precautions .title {
  font-weight: bold;
}
.setting_page.csv_import .precautions .description {
  padding-top: 16px;
}
.setting_page.csv_import .upload-area {
  display: inline-block;
  margin-top: 32px;
  background-color: #ECF0F5;
  border-radius: 8px;
}
.setting_page.csv_import .upload-area .input-area {
  display: flex;
}
.setting_page.csv_import .upload-area .input-area .text-area {
  padding-top: 40px;
  padding-left: 40px;
}
.setting_page.csv_import .upload-area .input-area .text-area .text {
  font-size: 16px;
  color: #000000;
}
.setting_page.csv_import .upload-area .input-area .file-area {
  padding-top: 48px;
}
.setting_page.csv_import .upload-area .input-area .file-area .file-name {
  padding-left: 8px;
}
.setting_page.csv_import .upload-area .input-area .error-area {
  color: red;
  padding: 0px 10px;
  margin: 10px 0px;
}
.setting_page.csv_import .upload-area .input-area .error-area .error-title {
  font-size: medium;
  font-weight: bold;
  margin-bottom: 4px;
}
.setting_page.csv_import .upload-area .input-area .error-area .row-error {
  padding: 4px 0px;
}
.setting_page.csv_import .upload-area .image-area {
  padding-left: 32px;
}
.setting_page.csv_import .code-select-area {
  display: inline-block;
  margin-top: 8px;
}
.setting_page.csv_import .code-select-area select {
  width: 242px;
  outline: none;
}
.setting_page.csv_import .detail-table {
  display: inline-table;
  width: 100%;
  table-layout: fixed;
}
.setting_page.csv_import .detail-table thead tr {
  font-size: 14px;
  font-family: ヒラギノ角ゴシック;
  font-weight: bold;
  border-bottom: 1px solid #D5DADF;
}
.setting_page.csv_import .detail-table thead tr td div {
  padding-left: 32px;
  padding-top: 8px;
  padding-bottom: 8px;
}
.setting_page.csv_import .detail-table tbody tr {
  border-radius: 4px;
}
.setting_page.csv_import .detail-table tbody tr:nth-child(odd) td {
  background: #FFFFFF;
}
.setting_page.csv_import .detail-table tbody tr td {
  background: #F5F5F5;
  vertical-align: middle;
  padding: 8px 0;
}
.setting_page.csv_import .detail-table tbody tr td .delete {
  color: #FF4560;
}
.setting_page.csv_import .detail-table tbody tr td .table-data {
  padding-left: 32px;
  padding-top: 8px;
  padding-bottom: 8px;
}
.setting_page.csv_import .detail-table tbody tr td .table-data .radius {
  width: 72px;
  height: 24px;
  border-radius: 8px;
  text-align: center;
  padding-top: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.setting_page.csv_import .detail-table tbody tr td .table-data .create {
  background-color: rgba(0, 204, 204, 0.2);
  color: #00cccc;
}
.setting_page.csv_import .detail-table tbody tr td .table-data .change {
  background-color: rgba(0, 143, 251, 0.2);
  color: #008ffb;
}
.setting_page.csv_import .detail-table tbody tr td .table-data .delete {
  background-color: rgba(255, 69, 96, 0.2);
  color: #ff4560;
}
.setting_page.csv_import .detail-table tbody tr td .table-data .none {
  background-color: rgba(77, 90, 123, 0.2);
  color: #4d5a7b;
}
.setting_page.csv_import .detail-table tbody tr td .table-data.none {
  display: block;
}
.setting_page.csv_import .detail-table th,
.setting_page.csv_import .detail-table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
  overflow-wrap: break-word;
}
.setting_page.csv_import .detail-table th:nth-child(1),
.setting_page.csv_import .detail-table td:nth-child(1) {
  width: 10%;
}
.setting_page.csv_import .detail-table th:nth-child(2),
.setting_page.csv_import .detail-table td:nth-child(2) {
  width: 10%;
}
.setting_page.csv_import .detail-table th:nth-child(3),
.setting_page.csv_import .detail-table td:nth-child(3) {
  width: 20%;
}
.setting_page.csv_import .detail-table th:nth-child(4),
.setting_page.csv_import .detail-table td:nth-child(4) {
  width: 18%;
}
.setting_page.csv_import .detail-table th:nth-child(5),
.setting_page.csv_import .detail-table td:nth-child(5) {
  width: 10%;
}
.setting_page.csv_import .detail-table th:nth-child(6),
.setting_page.csv_import .detail-table td:nth-child(6) {
  width: 8%;
}
.setting_page.csv_import .detail-table th:nth-child(7),
.setting_page.csv_import .detail-table td:nth-child(7) {
  width: 7%;
}
.setting_page.csv_import .detail-table th:nth-child(8),
.setting_page.csv_import .detail-table td:nth-child(8) {
  width: 17%;
}
.setting_page .check_item {
  color: #666;
}
.setting_page .mt-4 {
  margin-top: 16px;
}
.setting_page .help {
  position: relative;
}
.setting_page .help .icon {
  margin-left: 4px;
}
.setting_page .tips {
  position: relative;
}
.setting_page .tip_wrap {
  position: absolute;
  left: 50%;
  top: -10px;
  transform: translateY(-120%) translateX(-50%);
  background-color: #FFFFFF;
  color: #666666;
  padding: 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: initial;
  border: solid 1px #666666;
}
.setting_page .tip_wrap .tip {
  position: relative;
  white-space: nowrap;
}
.setting_page .tip_wrap .tip::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #FFFFFF;
  position: absolute;
  bottom: -17px;
  left: 50%;
  margin: auto;
  transform: rotate(45deg) translateX(-50%);
  z-index: 0;
  border-bottom: solid 1px #666666;
  border-right: solid 1px #666666;
}
.setting_page .tips:hover .tip_wrap {
  display: block;
}
.setting_page .add_button {
  background-color: #d5e8d4;
  color: #82b366;
  border-radius: 20px;
  padding: 8px 8px;
  display: inline-block;
  cursor: pointer;
  position: relative;
}
.setting_page .search_box {
  padding: 16px;
  position: absolute;
  top: 30px;
  display: block;
  border: 1px solid #cccccc;
  color: #666666;
  background-color: #FFFFFF;
  box-shadow: 0px 3px 6px #00000029;
  border-radius: 8px;
  z-index: 2110;
}
.setting_page .search_box.none {
  display: none;
}
.setting_page .search_box .search_detail {
  width: 400px;
  max-height: 300px;
  overflow: auto;
  scrollbar-width: none;
}
.setting_page .search_box .search_detail::-webkit-scrollbar {
  display: none;
}
.setting_page .search_box .search_detail .category {
  margin-bottom: 16px;
}
.setting_page .search_box .search_detail .category .category_title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  padding: 8px 4px;
  border-bottom: 1px solid #cccccc;
  margin-bottom: 8px;
}
.setting_page .search_box .search_detail .category .category_title .select_reset {
  font-size: 10px;
  cursor: pointer;
  color: #4572BA;
}
.setting_page .search_box .search_detail .category .search_area {
  position: relative;
  width: 100%;
  margin-bottom: 8px;
  background-color: #FFFFFF;
  border: solid 1px #CCCCCC;
  padding: 0 8px;
  border-radius: 4px;
  font-size: 12px;
  display: flex;
  align-items: center;
}
.setting_page .search_box .search_detail .category .search_area .icon {
  margin-right: 8px;
}
.setting_page .search_box .search_detail .category .search_area input[type=text] {
  width: 100%;
  font-size: 12px;
  border: none;
  background-color: transparent;
}
.setting_page .search_box .search_detail .category .search_area .reset {
  padding: 4px;
}
.setting_page .search_box .search_detail .category button.chip {
  background: #FFFFFF;
  border: solid 1px #CCCCCC;
  padding: 4px 8px;
  color: #333333;
  border-radius: 30px;
  margin: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.setting_page .search_box .search_detail .category button.chip.checked {
  color: #00a012;
  background-color: #e0f4e2;
}
.setting_page .search_box .search_detail .category label {
  display: flex;
  align-items: center;
  margin: 8px 4px;
}
.setting_page .search_box .search_detail .category label input[type=checkbox] {
  margin-right: 4px;
}
.setting_page .modal_body {
  padding: 32px;
  max-height: unset;
  overflow: unset;
}
.setting_page .modal_body fieldset {
  border: solid 1px #999999;
  border-radius: 4px;
  padding: 24px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}
.setting_page .modal_body fieldset legend {
  font-size: 14px;
  font-weight: bold;
  padding: 0 8px;
  color: #666666;
}
.setting_page .modal_body fieldset .item {
  width: 100%;
}
.setting_page .modal_body fieldset .item:last-of-type {
  margin-bottom: 0;
}
.setting_page .create_custom_alert_wizard_modal .modal_body {
  max-height: unset;
  overflow: unset;
}
.setting_page .create_custom_alert_wizard_modal .modal_body .select_button_area {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
.setting_page .create_custom_alert_wizard_modal .modal_body .select_button_area button {
  width: 100%;
  min-height: 150px;
  border-radius: 4px;
  padding: 8px;
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  color: #FFFFFF;
}
.setting_page .create_custom_alert_wizard_modal .modal_body .select_button_area button:hover {
  opacity: 0.8;
}
.setting_page .create_custom_alert_wizard_modal button.button {
  border-radius: 4px;
  width: 100%;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  background-color: #4472BA;
  color: #ffffff;
  position: relative;
}
.setting_page .create_custom_alert_wizard_modal button.button:hover {
  opacity: 0.8;
}
.setting_page .create_custom_alert_wizard_modal button.button:disabled {
  cursor: not-allowed;
  background-color: #CCCCCC;
}
.setting_page .download_csv_area,
.setting_page .download_pdf_area {
  font-size: 12px;
  position: relative;
  display: flex;
  justify-content: flex-end;
}
.setting_page .download_csv_area button,
.setting_page .download_pdf_area button {
  display: inline-block;
  border: 1px solid #4472ba;
  border-radius: 4px;
  padding: 4px 16px;
}
.setting_page .download_csv_area button.toggle,
.setting_page .download_pdf_area button.toggle {
  align-items: center;
  background-color: rgba(68, 114, 186, 0.1);
  color: #4472BA;
  display: flex;
  gap: 4px;
}
.setting_page .download_csv_area button.toggle .icon,
.setting_page .download_pdf_area button.toggle .icon {
  height: 24px;
  width: 24px;
}
.setting_page .download_csv_area button.toggle svg g,
.setting_page .download_pdf_area button.toggle svg g {
  fill: #4472BA;
}
.setting_page .download_csv_area button.toggle:hover,
.setting_page .download_pdf_area button.toggle:hover {
  color: #FFFFFF;
  background-color: #4472BA;
}
.setting_page .download_csv_area button.toggle:hover svg g,
.setting_page .download_pdf_area button.toggle:hover svg g {
  fill: #FFFFFF;
}
.setting_page .download_csv_area button.download,
.setting_page .download_pdf_area button.download {
  color: #656E73;
  background-color: #FFFFFF;
}
.setting_page .download_csv_area button.download:hover,
.setting_page .download_pdf_area button.download:hover {
  color: #FFFFFF;
  background-color: #656E73;
}
.setting_page .download_csv_area .download_csv_modal,
.setting_page .download_pdf_area .download_csv_modal {
  display: block;
  background-color: #FFFFFF;
  position: absolute;
  top: 50px;
  right: 0;
  z-index: 2050;
  text-align: left;
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  box-shadow: 0px 0px 3px #CCCCCC;
  width: max-content;
}
.setting_page .download_csv_area .download_csv_modal.none,
.setting_page .download_pdf_area .download_csv_modal.none {
  display: none;
}
.setting_page .download_csv_area .download_csv_modal .modal_title,
.setting_page .download_pdf_area .download_csv_modal .modal_title {
  padding: 16px;
  border-bottom: 1px solid #CCCCCC;
}
.setting_page .download_csv_area .download_csv_modal .detail,
.setting_page .download_pdf_area .download_csv_modal .detail {
  padding: 16px;
}
.setting_page .download_csv_area .download_csv_modal .detail .button_area,
.setting_page .download_pdf_area .download_csv_modal .detail .button_area {
  display: flex;
  justify-content: space-between;
}
.setting_page .download_csv_area .download_csv_modal .detail .button_area button,
.setting_page .download_pdf_area .download_csv_modal .detail .button_area button {
  padding: 4px 8px;
  margin-right: 0;
}
.setting_page .download_csv_area .download_csv_modal .detail .comment,
.setting_page .download_pdf_area .download_csv_modal .detail .comment {
  margin: 16px 0 0 0;
  color: #A8AFB4;
  font-size: 12px;
}

.report_page .modal_box {
  margin-top: 80px;
}
.report_page .modal_box .modal_header {
  padding: 32px;
  border-bottom: none;
}
.report_page .modal_box .modal_header .title {
  font-size: 20px;
  font-weight: bold;
}
.report_page .modal_box .modal_header .close_modal {
  position: absolute;
  top: -25px;
  right: -10px;
  font-size: 40px;
  border: none;
  background-color: transparent;
  transform: translateY(-50%);
  color: #FFF;
}
.report_page .modal_box .modal_body {
  max-height: 70vh;
  background-color: #ECF0F4;
  border-radius: 0 0 8px 8px;
}
.report_page .modal_box.report_modal {
  width: 1200px;
}
.report_page .modal_box.report_modal.weekly {
  width: 600px;
}
.report_page .modal_box.legacy_modal {
  width: 1200px;
}
.report_page .modal_box.legacy_modal .modal_body {
  background-color: #FFFFFF;
}
.report_page .modal_box.legacy_modal .modal_body .group .group_title {
  display: flex;
}
.report_page .modal_box.legacy_modal .modal_body .group .group_title .left {
  font-size: 18px;
  color: #ffffff;
  background-color: #666666;
  width: 70%;
  padding: 16px 24px;
  border-radius: 8px 0px 0px 8px;
  display: flex;
  align-items: center;
}
.report_page .modal_box.legacy_modal .modal_body .group .group_title .right {
  font-size: 16px;
  color: #666666;
  background-color: #ffffff;
  width: 30%;
  padding: 16px 24px;
  border-radius: 0px 8px 8px 0px;
  border: 1px solid #666666;
  display: flex;
  align-items: flex-end;
}
.report_page .modal_box.legacy_modal .modal_body .group .group_title .right span {
  font-size: 22px;
  margin: 0px 8px;
}
.report_page .modal_box.legacy_modal .modal_body .group .app_area {
  display: flex;
  flex-wrap: wrap;
}
.report_page .modal_box.legacy_modal .modal_body .group .app_area .item {
  width: 25%;
  text-align: center;
  padding: 24px;
}
.report_page .modal_box.legacy_modal .modal_body .group .app_area .item .service_name {
  border-bottom: 1px solid #666666;
  padding: 8px;
}
.report_page .modal_box.legacy_modal .modal_body .group .app_area .item .detail {
  padding: 8px;
}
.report_page .modal_box.legacy_modal .modal_body .group .app_area .item .detail .time {
  margin: 0px 4px;
}
.report_page .modal_box.legacy_modal .modal_body .group .app_area .item .detail .count {
  font-size: 18px;
  font-weight: bold;
  margin: 0px 4px;
}
.report_page .modal_box.legacy_modal .modal_body .group .app_area .item button {
  border-radius: 4px;
  background-color: #FFFFFF;
  padding: 8px 16px;
  border: 1px solid #656E73;
  color: #656E73;
  font-weight: 600;
}
.report_page .modal_box.legacy_modal .modal_body .group .app_area .item button:hover {
  background-color: #656E73;
  color: #FFFFFF;
}
.report_page .modal_box.member_modal {
  width: 1300px;
}
.report_page .modal_box.member_modal.list_box {
  padding: 0;
}
.report_page .modal_box.member_modal .modal_body {
  max-height: 1000px;
  background-color: #FFFFFF;
  padding: 24px 24px 0;
}
.report_page .modal_box.member_modal .close_screen {
  height: 100%;
}
.report_page .heatmap_wrap .title {
  margin-bottom: 24px;
  font-size: 18px;
  font-weight: bold;
  color: #666666;
}
.report_page .heatmap_wrap .heatmap_graph {
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 16px;
  position: relative;
  background-color: #ffffff;
}
.report_page .heatmap_wrap .heatmap_graph .range {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 16px;
  color: #666666;
}
.report_page .heatmap_wrap .heatmap_graph .heatmap {
  margin-bottom: 16px;
}
.report_page .heatmap_wrap .heatmap_graph .heatmap .row {
  display: flex;
  align-items: center;
}
.report_page .heatmap_wrap .heatmap_graph .heatmap .row .name {
  width: 90px;
  color: #e27c0f;
}
.report_page .heatmap_wrap .heatmap_graph .heatmap .row .average {
  width: 90px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  color: #333333;
  text-shadow: #ffffff 0px 0px 5px;
}
.report_page .heatmap_wrap .heatmap_graph .heatmap .row .item {
  width: 30px;
  height: 30px;
  border: 1px solid #ffffff;
  cursor: pointer;
  background-color: #ffffff;
  margin-bottom: 0;
}
.report_page .heatmap_wrap .heatmap_graph .heatmap .row .item:hover {
  background-color: #F6CC7A !important;
}
.report_page .heatmap_wrap .heatmap_graph .heatmap .row .item.no_data:hover {
  background-color: transparent !important;
}
.report_page .heatmap_wrap .heatmap_graph .heatmap .label {
  display: flex;
  align-items: center;
  margin-top: 4px;
}
.report_page .heatmap_wrap .heatmap_graph .heatmap .label .name {
  width: 90px;
}
.report_page .heatmap_wrap .heatmap_graph .heatmap .label .average {
  width: 90px;
  height: 30px;
  border: 1px solid #ffffff;
  text-align: center;
  color: #666666;
}
.report_page .heatmap_wrap .heatmap_graph .heatmap .label .item {
  width: 30px;
  height: 30px;
  border: 1px solid #ffffff;
  text-align: center;
  margin-bottom: 0;
}
.report_page .heatmap_wrap .heatmap_graph .heatmap .close_heatmap_screen {
  width: 100%;
  height: -webkit-fill-available;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: none;
}
.report_page .heatmap_wrap .heatmap_graph .bottom_area {
  display: flex;
  justify-content: right;
}
.report_page .heatmap_wrap .heatmap_graph .bottom_area .legend {
  width: 450px;
  padding: 8px 16px;
  font-size: 12px;
}
.report_page .heatmap_wrap .heatmap_graph .bottom_area .legend .legend_title {
  text-align: center;
}
.report_page .heatmap_wrap .heatmap_graph .bottom_area .legend .bar {
  width: 100%;
  height: 16px;
  margin: 4px 0px;
}
.report_page .heatmap_wrap .heatmap_graph .bottom_area .legend .label {
  display: flex;
  justify-content: space-between;
}
.report_page .heatmap_wrap .tip_wrap {
  padding: 8px;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 4px;
  text-align: left;
  position: absolute;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  min-width: 150px;
  z-index: 2;
}
.report_page .heatmap_wrap .tip_wrap .tip {
  position: relative;
}
.report_page .heatmap_wrap .tip_wrap .tip::before {
  content: "";
  width: 20px;
  height: 20px;
  background-color: #FFF;
  position: absolute;
  bottom: -18px;
  right: 0;
  left: 0;
  margin: auto;
  transform: rotate(45deg);
  border-right: solid 1px #CCC;
  border-bottom: solid 1px #CCC;
  z-index: -1;
}
.report_page .heatmap_wrap .tip_wrap .tip .title {
  padding: 16px 16px;
  margin: -8px -8px 8px;
  background-color: #ECF0F5;
  text-align: center;
  font-size: 14px;
}
.report_page .heatmap_wrap .tip_wrap .tip .date {
  color: #333333;
  font-size: 12px;
  font-weight: 300;
  margin-bottom: 4px;
}
.report_page .heatmap_wrap .tip_wrap .tip .value {
  color: #333333;
  font-size: 14px;
  font-weight: 600;
}
.report_page .heatmap_wrap .tip_wrap .tip button.view {
  border: 1px solid #4472BA;
  border-radius: 4px;
  margin-top: 8px;
  width: 100%;
  padding: 8px 16px;
  background-color: #FFFFFF;
  color: #4472BA;
  font-weight: 600;
}
.report_page .heatmap_wrap .tip_wrap .tip button.view:hover {
  background-color: #4472BA;
  color: #FFFFFF;
}
.report_page .heatmap_wrap .tip_wrap .tip button.close {
  position: absolute;
  top: 0px;
  right: -4px;
  line-height: 1.2em;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px;
}
.report_page .modern_app_introduction_wrap {
  margin-bottom: 16px;
}
.report_page .modern_app_introduction_wrap .modern_app_introduction {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.report_page .modern_app_introduction_wrap .modern_app_introduction .group {
  padding-bottom: 20px;
  width: calc(50% - 8px);
}
.report_page .modern_app_introduction_wrap .modern_app_introduction .group .group_title {
  padding-bottom: 4px;
}
.report_page .modern_app_introduction_wrap .modern_app_introduction .group .group_modern_app_wrap {
  border: 1px solid #ccc;
  display: flex;
  flex-wrap: wrap;
  padding: 0 8px 10px;
}
.report_page .modern_app_introduction_wrap .modern_app_introduction .group .group_modern_app_wrap .group_modern_app {
  align-items: center;
  color: #999;
  display: flex;
  flex-flow: column;
  font-size: 10px;
  position: relative;
  width: 12.5%;
}
.report_page .modern_app_introduction_wrap .modern_app_introduction .group .group_modern_app_wrap .group_modern_app .group_modern_app_icon_wrap {
  align-items: center;
  border-radius: 50px;
  box-shadow: 0px 0px 3px #ccc;
  display: flex;
  justify-content: center;
  height: 50px;
  margin-top: 10px;
  width: 50px;
}
.report_page .modern_app_introduction_wrap .modern_app_introduction .group .group_modern_app_wrap .group_modern_app .group_modern_app_icon_wrap .group_modern_app_icon {
  color: #fff;
  height: 50%;
  width: 50%;
}
.report_page .modern_app_introduction_wrap .modern_app_introduction .group .group_modern_app_wrap .group_modern_app .group_modern_app_name {
  display: -webkit-box;
  margin-top: 8px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.report_page .modern_app_introduction_wrap .modern_app_introduction .group .group_modern_app_wrap .group_modern_app .group_modern_app_tip {
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 6px;
  bottom: -7px;
  filter: drop-shadow(1px 1px 1px #b2b2b2);
  line-height: 1.4;
  position: absolute;
  padding: 4px 8px;
  opacity: 0;
  text-align: center;
  transition: 0.5s;
  white-space: nowrap;
  z-index: -1;
}
.report_page .modern_app_introduction_wrap .modern_app_introduction .group .group_modern_app_wrap .group_modern_app:hover .group_modern_app_tip {
  opacity: 1;
  z-index: 2;
}
.report_page .process_wrap,
.report_page .modern_apps_utilization_wrap {
  position: relative;
  margin-bottom: 16px;
}
.report_page .process_wrap .header_area,
.report_page .modern_apps_utilization_wrap .header_area {
  display: flex;
  margin-top: 24px;
  margin-bottom: 24px;
}
.report_page .process_wrap .header_area .header_title,
.report_page .modern_apps_utilization_wrap .header_area .header_title {
  min-width: 200px;
}
.report_page .process_wrap .detail_area,
.report_page .modern_apps_utilization_wrap .detail_area {
  position: relative;
}
.report_page .process_wrap .detail_area .ruler_area,
.report_page .modern_apps_utilization_wrap .detail_area .ruler_area {
  position: absolute;
  min-width: calc(100% - 400px);
  height: 100%;
  margin-left: 400px;
}
.report_page .process_wrap .detail_area .ruler_area .ruler,
.report_page .modern_apps_utilization_wrap .detail_area .ruler_area .ruler {
  position: absolute;
  top: 0px;
  left: 0%;
  width: 1px;
  height: 100%;
  background-color: #eeeeee;
  z-index: 1;
}
.report_page .process_wrap .detail_area .row,
.report_page .modern_apps_utilization_wrap .detail_area .row {
  display: flex;
  align-items: center;
  position: relative;
  border-bottom: 1px solid #cccccc;
}
.report_page .process_wrap .detail_area .row .title_area,
.report_page .modern_apps_utilization_wrap .detail_area .row .title_area {
  min-width: 200px;
  padding-right: 8px;
}
.report_page .process_wrap .detail_area .row .picture_area,
.report_page .modern_apps_utilization_wrap .detail_area .row .picture_area {
  min-width: 200px;
  padding-right: 8px;
  display: flex;
  align-items: center;
  position: relative;
  cursor: pointer;
  height: max-content;
}
.report_page .process_wrap .detail_area .row .picture_area:hover,
.report_page .modern_apps_utilization_wrap .detail_area .row .picture_area:hover {
  opacity: 0.8;
}
.report_page .process_wrap .detail_area .row .picture_area.legacy,
.report_page .modern_apps_utilization_wrap .detail_area .row .picture_area.legacy {
  cursor: unset;
}
.report_page .process_wrap .detail_area .row .picture_area.legacy .picture_text,
.report_page .modern_apps_utilization_wrap .detail_area .row .picture_area.legacy .picture_text {
  position: absolute;
}
.report_page .process_wrap .detail_area .row .graph_wrap,
.report_page .modern_apps_utilization_wrap .detail_area .row .graph_wrap {
  min-width: calc(100% - 400px);
  padding: 10px 0px;
  background-color: #eeeeee;
}
.report_page .process_wrap .detail_area .row .graph_wrap .graph,
.report_page .modern_apps_utilization_wrap .detail_area .row .graph_wrap .graph {
  width: 100%;
  height: 30px;
  background-color: #0a4e8c;
  position: relative;
  border-radius: 0px 4px 4px 0px;
  cursor: pointer;
}
.report_page .process_wrap .detail_area .row .graph_wrap .graph:hover,
.report_page .modern_apps_utilization_wrap .detail_area .row .graph_wrap .graph:hover {
  opacity: 0.8;
}
.report_page .process_wrap .tip_wrap,
.report_page .modern_apps_utilization_wrap .tip_wrap {
  padding: 8px;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 4px;
  text-align: left;
  position: absolute;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  min-width: 150px;
  z-index: 2;
}
.report_page .process_wrap .tip_wrap .tip,
.report_page .modern_apps_utilization_wrap .tip_wrap .tip {
  position: relative;
}
.report_page .process_wrap .tip_wrap .tip::before,
.report_page .modern_apps_utilization_wrap .tip_wrap .tip::before {
  content: "";
  width: 20px;
  height: 20px;
  background-color: #FFF;
  position: absolute;
  bottom: -18px;
  right: 0;
  left: 0;
  margin: auto;
  transform: rotate(45deg);
  border-right: solid 1px #CCC;
  border-bottom: solid 1px #CCC;
  z-index: -1;
}
.report_page .process_wrap .tip_wrap .tip .title,
.report_page .modern_apps_utilization_wrap .tip_wrap .tip .title {
  padding: 16px 16px;
  margin: -8px -8px 8px;
  background-color: #ECF0F5;
  text-align: center;
  font-size: 14px;
}
.report_page .process_wrap .tip_wrap .tip .date,
.report_page .modern_apps_utilization_wrap .tip_wrap .tip .date {
  color: #333333;
  font-size: 12px;
  font-weight: 300;
  margin-bottom: 4px;
}
.report_page .process_wrap .tip_wrap .tip .value,
.report_page .modern_apps_utilization_wrap .tip_wrap .tip .value {
  color: #333333;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 4px;
}
.report_page .process_wrap .tip_wrap .tip button.view,
.report_page .modern_apps_utilization_wrap .tip_wrap .tip button.view {
  border: 1px solid #4472BA;
  border-radius: 4px;
  margin-top: 8px;
  width: 100%;
  padding: 8px 16px;
  background-color: #FFFFFF;
  color: #4472BA;
  font-weight: 600;
  text-align: center;
}
.report_page .process_wrap .tip_wrap .tip button.view:hover,
.report_page .modern_apps_utilization_wrap .tip_wrap .tip button.view:hover {
  background-color: #4472BA;
  color: #FFFFFF;
}
.report_page .process_wrap .tip_wrap .tip button.close,
.report_page .modern_apps_utilization_wrap .tip_wrap .tip button.close {
  position: absolute;
  top: 0px;
  right: -4px;
  line-height: 1.2em;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px;
}
.report_page .process_wrap .member_tip_wrap,
.report_page .modern_apps_utilization_wrap .member_tip_wrap {
  padding: 8px;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 4px;
  text-align: left;
  position: absolute;
  transform: translateX(-110%) translateY(-7%);
  display: block;
  min-width: 150px;
  z-index: 2;
}
.report_page .process_wrap .member_tip_wrap .tip,
.report_page .modern_apps_utilization_wrap .member_tip_wrap .tip {
  position: relative;
  padding: 0 16px;
}
.report_page .process_wrap .member_tip_wrap .tip::before,
.report_page .modern_apps_utilization_wrap .member_tip_wrap .tip::before {
  content: "";
  width: 20px;
  height: 20px;
  background-color: #ECF0F5;
  position: absolute;
  right: -19px;
  top: 16px;
  margin: auto;
  transform: rotate(-45deg);
  border-right: solid 1px #CCC;
  border-bottom: solid 1px #CCC;
  z-index: -1;
}
.report_page .process_wrap .member_tip_wrap .tip .title,
.report_page .modern_apps_utilization_wrap .member_tip_wrap .tip .title {
  padding: 16px 16px;
  margin: -8px -24px 8px;
  background-color: #ECF0F5;
  text-align: center;
  font-size: 14px;
}
.report_page .process_wrap .member_tip_wrap .tip .personal,
.report_page .modern_apps_utilization_wrap .member_tip_wrap .tip .personal {
  display: flex;
  align-items: center;
  padding: 8px 0px;
  border-bottom: 1px solid #CCC;
}
.report_page .process_wrap .member_tip_wrap .tip .personal .icon,
.report_page .modern_apps_utilization_wrap .member_tip_wrap .tip .personal .icon {
  width: 36px;
  height: 36px;
  margin-right: 8px;
}
.report_page .process_wrap .member_tip_wrap .tip .personal .icon img,
.report_page .modern_apps_utilization_wrap .member_tip_wrap .tip .personal .icon img {
  width: 100%;
  border-radius: 50%;
}
.report_page .process_wrap .member_tip_wrap .tip .personal .name,
.report_page .modern_apps_utilization_wrap .member_tip_wrap .tip .personal .name {
  margin-right: 8px;
  text-align: left;
  font-size: 12px;
  width: 130px;
}
.report_page .process_wrap .member_tip_wrap .tip .personal:nth-last-of-type(1),
.report_page .modern_apps_utilization_wrap .member_tip_wrap .tip .personal:nth-last-of-type(1) {
  border-bottom: none;
}
.report_page .process_wrap .member_tip_wrap .tip button.view,
.report_page .modern_apps_utilization_wrap .member_tip_wrap .tip button.view {
  border: 1px solid #4472BA;
  border-radius: 4px;
  padding: 8px 16px;
  background-color: #FFFFFF;
  color: #4472BA;
  font-weight: 600;
  text-align: center;
}
.report_page .process_wrap .member_tip_wrap .tip button.view:hover,
.report_page .modern_apps_utilization_wrap .member_tip_wrap .tip button.view:hover {
  background-color: #4472BA;
  color: #FFFFFF;
}
.report_page .process_wrap .member_tip_wrap .tip button.close,
.report_page .modern_apps_utilization_wrap .member_tip_wrap .tip button.close {
  position: absolute;
  top: 0px;
  right: -4px;
  line-height: 1.2em;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px;
}
.report_page .process_wrap .close_process_screen,
.report_page .process_wrap .close_legacy_screen,
.report_page .modern_apps_utilization_wrap .close_process_screen,
.report_page .modern_apps_utilization_wrap .close_legacy_screen {
  width: 100%;
  height: -webkit-fill-available;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #ffffff;
  opacity: 0.6;
  display: none;
}
.report_page .viewable_manager {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 16px;
}
.report_page .viewable_manager .icon {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  margin-right: 4px;
}
.report_page .viewable_manager .icon img {
  width: 100%;
  border-radius: 50%;
}
.report_page .page_header .report_title {
  font-size: 30px;
  color: #666666;
}
.report_page .inner_contents {
  display: flex;
  align-items: center;
  margin: 30px 0px;
}
.report_page .inner_contents .page_contents {
  width: 90%;
  min-height: 0px;
  margin: 0px;
}
.report_page .inner_contents .page_contents .content-block {
  padding: 0px;
}
.report_page .inner_contents .page_contents .content-block .block-header {
  margin: 0px -24px;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 40px;
}
.report_page .inner_contents .page_contents .content-block .block-header .title {
  margin-bottom: 0;
  white-space: nowrap;
}
.report_page .inner_contents .page_contents .content-block .block-header .title .icon_warn {
  position: absolute;
  top: -18px;
  left: -41px;
}
.report_page .inner_contents .page_contents .content-block .block-header .description {
  display: flex;
  align-items: center;
  color: #CCCCCC;
  word-break: break-all;
}
.report_page .inner_contents .page_contents .content-block .block-header .description::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 1px;
  background-color: #CCCCCC;
  margin: 0 16px;
}
.report_page .inner_contents .page_contents .content-block.work_volume_variation {
  color: #333;
  margin: 0;
  padding: 0;
}
.report_page .inner_contents .page_contents .content-block.work_volume_variation .block-header {
  margin: 0 0 20px;
}
.report_page .indicator_head {
  display: flex;
  align-items: baseline;
  margin-bottom: 12px;
}
.report_page .indicator_head .left {
  width: 55%;
  display: flex;
  align-items: center;
  padding: 0px 8px;
}
.report_page .indicator_head .left .left_area {
  min-width: 120px;
  text-align: center;
}
.report_page .indicator_head .left .labels {
  display: flex;
  width: 100%;
  margin-right: 80px;
}
.report_page .indicator_head .left .labels.team div {
  width: 25%;
  text-align: center;
  font-size: 10px;
  color: #4E585D;
  font-weight: 400;
}
.report_page .indicator_head .left .labels.member div {
  width: 20%;
  text-align: center;
  font-size: 10px;
  color: #4E585D;
  font-weight: 400;
}
.report_page .indicator_head .right {
  width: 45%;
  display: flex;
  justify-content: center;
}
.report_page .indicator_head .right .tips {
  position: relative;
}
.report_page .indicator_head .right .tip_wrap {
  display: none;
  position: absolute;
  left: 50%;
  transform: translateY(-120%) translateX(-50%);
  background-color: #000000;
  color: #FFFFFF;
  padding: 8px;
  border-radius: 4px;
}
.report_page .indicator_head .right .tip_wrap .tip {
  position: relative;
  white-space: nowrap;
}
.report_page .indicator_head .right .tip_wrap .tip::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #000000;
  position: absolute;
  bottom: -15px;
  left: 50%;
  margin: auto;
  transform: rotate(45deg) translateX(-50%);
  z-index: 0;
}
.report_page .indicator_head .right img {
  width: 40px;
  height: 40px;
  margin: 0 4px;
}
.report_page .indicator_head .right .tips:hover .tip_wrap {
  display: block;
}
.report_page .indicator_item {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
  position: relative;
}
.report_page .indicator_item .icon_warn {
  position: absolute;
}
.report_page .indicator_item .left {
  width: 55%;
  display: flex;
  align-items: center;
  padding: 0px 8px;
}
.report_page .indicator_item .left .text_area {
  min-width: 110px;
  max-width: 110px;
  text-align: right;
  font-size: 10px;
  color: #333333;
  font-weight: 600;
  margin-right: 10px;
}
.report_page .indicator_item .left .text_area button {
  text-align: center;
  color: #656E73;
  border: 1px solid #656E73;
  border-radius: 4px;
  background-color: #FFFFFF;
  padding: 4px 8px;
  font-size: 10px;
  width: 100%;
  margin-top: 4px;
}
.report_page .indicator_item .left .text_area button:hover {
  color: #FFFFFF;
  background-color: #656E73;
}
.report_page .indicator_item .left .text_area button:disabled {
  color: #BFC4C9;
  border: 1px solid #BFC4C9;
  border-radius: 4px;
  background-color: transparent;
  cursor: not-allowed;
}
.report_page .indicator_item .left .text_area button:disabled:hover {
  color: #BFC4C9;
  border: 1px solid #BFC4C9;
  border-radius: 4px;
  background-color: transparent;
  cursor: not-allowed;
}
.report_page .indicator_item .left .text_area.checked button {
  color: #FFFFFF;
  background-color: #4472BA;
  border: 1px solid #4472BA;
}
.report_page .indicator_item .left .text_area.checked button:hover {
  color: #FFFFFF;
  background-color: #094E8D;
}
.report_page .indicator_item .left .text_area .title_area {
  display: flex;
  align-items: center;
  cursor: default;
  position: relative;
  justify-content: right;
}
.report_page .indicator_item .left .text_area .title_area.help {
  cursor: help;
}
.report_page .indicator_item .left .text_area .title_area .icon {
  margin-left: 4px;
}
.report_page .indicator_item .left .text_area .title_area .icon svg {
  width: 12px;
  height: 12px;
}
.report_page .indicator_item .left .text_area .title_area .title_wrap {
  display: flex;
  flex-flow: column;
  align-items: flex-end;
}
.report_page .indicator_item .left .text_area .title_area .title_wrap .prefix {
  color: #999999;
  margin-bottom: 4px;
}
.report_page .indicator_item .left .text_area .title_area .title_wrap .title_detail {
  font-size: 12px;
  color: #333333;
}
.report_page .indicator_item .left .text_area .title_area .tip_wrap {
  position: absolute;
  left: 0;
  transform: translateY(-120%);
  background-color: #000000;
  color: #FFFFFF;
  padding: 8px;
  border-radius: 4px;
}
.report_page .indicator_item .left .text_area .title_area .tip_wrap .tip {
  position: relative;
  white-space: nowrap;
}
.report_page .indicator_item .left .text_area .title_area .tip_wrap .tip::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #000000;
  position: absolute;
  bottom: -13px;
  left: 90px;
  margin: auto;
  transform: rotate(45deg);
  z-index: 0;
}
.report_page .indicator_item .left .values {
  display: flex;
  width: calc(100% - 200px);
  border: 1px solid #FFFFFF;
  color: #999999;
}
.report_page .indicator_item .left .values .value {
  border: 1px solid #FFFFFF;
  text-align: center;
  padding: 8px 0px;
  background-color: #F0F0F0;
  font-weight: 400;
  min-height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  word-break: break-all;
  font-size: 10px;
}
.report_page .indicator_item .left .values .value span {
  font-size: 16px;
  color: #777777;
  font-weight: bold;
}
.report_page .indicator_item .left .values .value.standard {
  background-color: #d4eddd;
}
.report_page .indicator_item .left .values .value.standard span {
  color: #0b5e37;
}
.report_page .indicator_item .left .values .value:nth-of-type(1) {
  background-color: #F5F8FB;
}
.report_page .indicator_item .left .values .value:nth-of-type(1) span {
  color: #0a4e8d;
}
.report_page .indicator_item .left .values.team .value {
  width: 25%;
}
.report_page .indicator_item .left .values.team.checked .value:nth-of-type(1) span {
  color: #FEA800;
}
.report_page .indicator_item .left .values.member .value {
  width: 20%;
}
.report_page .indicator_item .left .values.member.checked .value:nth-of-type(1) span {
  color: #FEA800;
}
.report_page .indicator_item .left .button_area {
  min-width: 70px;
  text-align: left;
  font-size: 10px;
  color: #333333;
  font-weight: 600;
  margin-left: 10px;
}
.report_page .indicator_item .left .button_area button {
  text-align: center;
  color: #656E73;
  border: 1px solid #656E73;
  border-radius: 4px;
  background-color: #FFFFFF;
  padding: 4px 8px;
  font-size: 10px;
  width: 100%;
  margin-top: 4px;
}
.report_page .indicator_item .left .button_area button:hover {
  color: #FFFFFF;
  background-color: #656E73;
}
.report_page .indicator_item .left .button_area button:disabled {
  color: #BFC4C9;
  border: 1px solid #BFC4C9;
  border-radius: 4px;
  background-color: transparent;
  cursor: not-allowed;
}
.report_page .indicator_item .left .button_area button:disabled:hover {
  color: #BFC4C9;
  border: 1px solid #BFC4C9;
  border-radius: 4px;
  background-color: transparent;
  cursor: not-allowed;
}
.report_page .indicator_item .left .button_area.checked button {
  color: #FFFFFF;
  background-color: #4472BA;
  border: 1px solid #4472BA;
}
.report_page .indicator_item .left .button_area.checked button:hover {
  color: #FFFFFF;
  background-color: #094E8D;
}
.report_page .indicator_item .right {
  width: 45%;
  align-items: center;
  padding: 0px 8px;
}
.report_page .indicator_item .right .graph {
  width: 90%;
  height: 24px;
  position: relative;
  margin: auto;
}
.report_page .indicator_item .right .graph .vertical {
  position: absolute;
  top: 50%;
  left: 0%;
  height: 14px;
  width: 1px;
  background-color: #D5DADF;
  transform: translateY(-50%);
  z-index: 3;
}
.report_page .indicator_item .right .graph .horizontal {
  position: absolute;
  top: 55%;
  height: 5px;
  width: 100%;
  background-color: #D0D0D0;
  transform: translateY(-70%);
  z-index: 3;
}
.report_page .indicator_item .right .graph .horizontal.half {
  background: linear-gradient(to right, #EEEEEE 50%, #D0D0D0 50%, #D0D0D0 100%);
}
.report_page .indicator_item .right .graph .appropriate_horizontal {
  position: absolute;
  top: 12.5px;
  height: 5px;
  background-color: #4372BA;
  transform: translateY(-50%);
  z-index: 3;
}
.report_page .indicator_item .right .graph .appropriate_vertical {
  position: absolute;
  top: 50%;
  height: 16px;
  width: 2px;
  background-color: #4372BA;
  transform: translateY(-50%);
  z-index: 3;
}
.report_page .indicator_item .right .graph .appropriate_text {
  position: absolute;
  top: -15px;
  color: #999999;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
}
.report_page .indicator_item .right .graph .base_vertical {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 4px;
  height: 16px;
  background-color: #4372BA;
  transform: translateY(-50%);
  z-index: 3;
}
.report_page .indicator_item .right .graph .base_text {
  position: absolute;
  top: -15px;
  left: 0%;
  width: 100%;
  color: #999999;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
}
.report_page .indicator_item .right .graph .label_left {
  position: absolute;
  top: 50%;
  left: 0px;
  transform: translateY(-50%) translateX(calc(-100% - 16px));
  font-size: 8px;
  white-space: nowrap;
  color: #595757;
  font-weight: 300;
}
.report_page .indicator_item .right .graph .label_right {
  position: absolute;
  top: 50%;
  left: 100%;
  transform: translateY(-50%) translateX(16px);
  font-size: 8px;
  white-space: nowrap;
  color: #595757;
  font-weight: 300;
}
.report_page .indicator_item .right .graph .graph_point {
  position: absolute;
  top: 50%;
  transform: translateY(-50%) translateX(-50%) rotate(45deg);
  z-index: 4;
  width: 12px;
  height: 12px;
  background-color: #094E8D;
  border: solid 1px #FFF;
}
.report_page .indicator_item .right .graph .graph_point.checked {
  background-color: #feb019;
}
.report_page .indicator_item .right .label {
  position: relative;
  width: 90%;
  font-size: 10px;
  margin: 4px auto 0;
  height: 12px;
}
.report_page .indicator_item .right .label .label_text {
  position: absolute;
  top: 0px;
  transform: translateX(-50%);
  white-space: nowrap;
  font-size: 8px;
  color: #92999E;
  font-weight: 300;
}
.report_page .improvement_graph {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}
.report_page .improvement_graph .left {
  width: 20%;
  margin: 0px 8% 0px 2%;
}
.report_page .improvement_graph .left .item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px;
}
.report_page .improvement_graph .left .item:nth-last-of-type(1) {
  border-top: 1px solid #4372ba;
  color: #4372ba;
}
.report_page .improvement_graph .left .item .point {
  font-size: 20px;
  font-weight: bold;
}
.report_page .improvement_graph .right {
  height: 200px;
  width: 100%;
  position: relative;
}
.report_page .improvement_graph .right .background table {
  height: 200px;
  width: 100%;
}
.report_page .improvement_graph .right .background table td {
  border: 1px solid #cccccc;
}
.report_page .improvement_graph .right canvas {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 200px;
}
.report_page .improvement_graph .right .vertical_label {
  position: absolute;
  transform: translateX(-50%) translateY(-50%);
  left: -20px;
  font-size: 12px;
  color: #cccccc;
}
.report_page .improvement_graph .right .vertical_label:nth-of-type(2) {
  top: 0;
}
.report_page .improvement_graph .right .vertical_label:nth-of-type(3) {
  top: 20%;
}
.report_page .improvement_graph .right .vertical_label:nth-of-type(4) {
  top: 40%;
}
.report_page .improvement_graph .right .vertical_label:nth-of-type(5) {
  top: 60%;
}
.report_page .improvement_graph .right .vertical_label:nth-of-type(6) {
  top: 80%;
}
.report_page .improvement_graph .right .vertical_label:nth-of-type(7) {
  top: 100%;
}
.report_page .improvement_graph .right .horizontal_label {
  position: absolute;
  transform: translateX(-50%) translateY(-50%);
  bottom: -35px;
  font-size: 12px;
  color: #cccccc;
  white-space: nowrap;
}
.report_page .improvement_graph .right .past_mark {
  position: absolute;
  transform: translateX(-50%) translateY(-50%);
  background-color: #008ffb;
  width: 16px;
  height: 16px;
  border-radius: 50%;
}
.report_page .improvement_graph .right .current_mark {
  position: absolute;
  transform: translateX(-50%) translateY(-50%);
  left: 100%;
  background-color: white;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 5px solid #008ffb;
  box-shadow: #008ffb 0px 0px 6px;
}
.report_page .improvement_graph .right .current_point {
  position: absolute;
  transform: translateX(-50%) translateY(-50%);
  left: 100%;
  color: #008ffb;
  font-size: 20px;
  font-weight: bold;
}
.report_page .work_volume_variation_graph {
  align-items: center;
  display: flex;
  margin-bottom: 16px;
}
.report_page .work_volume_variation_graph .left,
.report_page .work_volume_variation_graph .right {
  border: 1px solid #f0f0f0;
  flex: 1;
  margin: 0 12px;
  position: relative;
}
.report_page .work_volume_variation_graph .left .graph_title,
.report_page .work_volume_variation_graph .right .graph_title {
  font-size: 14px;
  left: 50%;
  position: absolute;
  top: 10px;
  transform: translate(-50%, 0%);
  -ms-transform: translate(-50%, 0%);
  -webkit-transform: translate(-50%, 0%);
}
.report_page .work_volume_variation_graph .left .graph_title .icon,
.report_page .work_volume_variation_graph .right .graph_title .icon {
  margin-left: 4px;
}
.report_page .work_volume_variation_graph .left .graph_title .detail_title .tip_wrap,
.report_page .work_volume_variation_graph .right .graph_title .detail_title .tip_wrap {
  background-color: #000;
  border-radius: 4px;
  color: #fff;
  font-size: 10px;
  right: 7px;
  padding: 8px;
  position: absolute;
  top: -42px;
  transform: translate(50%, 0);
  z-index: 5;
}
.report_page .work_volume_variation_graph .left .graph_title .detail_title .tip_wrap .tip,
.report_page .work_volume_variation_graph .right .graph_title .detail_title .tip_wrap .tip {
  position: relative;
  white-space: nowrap;
}
.report_page .work_volume_variation_graph .left .graph_title .detail_title .tip_wrap .tip::before,
.report_page .work_volume_variation_graph .right .graph_title .detail_title .tip_wrap .tip::before {
  background-color: #000;
  bottom: -13px;
  content: "";
  height: 10px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  transform: rotate(45deg);
  width: 10px;
  z-index: 0;
}
.report_page .work_volume_variation_graph .left .graph_area,
.report_page .work_volume_variation_graph .right .graph_area {
  margin: 60px 20px 40px 50px;
  min-height: 250px;
  position: relative;
}
.report_page .work_volume_variation_graph .left .graph_area table,
.report_page .work_volume_variation_graph .right .graph_area table {
  height: 200px;
  width: 100%;
  height: 100%;
  left: 0px;
  min-height: 200px;
  position: absolute;
  top: 0px;
  width: 100%;
}
.report_page .work_volume_variation_graph .left .graph_area table tr,
.report_page .work_volume_variation_graph .right .graph_area table tr {
  border-top: 1px solid #f0f0f0;
}
.report_page .work_volume_variation_graph .left .graph_area table tr:last-child,
.report_page .work_volume_variation_graph .right .graph_area table tr:last-child {
  border-bottom: 1px solid #f0f0f0;
}
.report_page .work_volume_variation_graph .left .graph_area .canvas,
.report_page .work_volume_variation_graph .right .graph_area .canvas {
  height: 100%;
  left: 0px;
  min-height: 250px;
  position: absolute;
  top: 0px;
  width: 100%;
}
.report_page .work_volume_variation_graph .left .vertical_label,
.report_page .work_volume_variation_graph .right .vertical_label {
  color: #999;
  font-size: 10px;
  font-weight: 700;
  left: -10px;
  position: absolute;
  transform: translate(-50%, 50%);
}
.report_page .work_volume_variation_graph .left .vertical_label .vertical_label_value,
.report_page .work_volume_variation_graph .right .vertical_label .vertical_label_value {
  margin-top: 2px;
}
.report_page .work_volume_variation_graph .left .vertical_label.unit,
.report_page .work_volume_variation_graph .right .vertical_label.unit {
  left: -14px;
  top: -24px;
}
.report_page .work_volume_variation_graph .left .vertical_label.unit.biz,
.report_page .work_volume_variation_graph .right .vertical_label.unit.biz {
  left: -12px;
}
.report_page .work_volume_variation_graph .left .vertical_label.time.label_0, .report_page .work_volume_variation_graph .left .vertical_label.time.label_1,
.report_page .work_volume_variation_graph .right .vertical_label.time.label_0,
.report_page .work_volume_variation_graph .right .vertical_label.time.label_1 {
  left: -7px;
}
.report_page .work_volume_variation_graph .left .vertical_label.biz,
.report_page .work_volume_variation_graph .right .vertical_label.biz {
  left: -18px;
}
.report_page .work_volume_variation_graph .left .vertical_label.biz.label_0,
.report_page .work_volume_variation_graph .right .vertical_label.biz.label_0 {
  left: -5px;
}
.report_page .work_volume_variation_graph .left .horizontal_label,
.report_page .work_volume_variation_graph .right .horizontal_label {
  bottom: -36px;
  color: #777;
  font-size: 11px;
  font-weight: 700;
  height: 25px;
  position: absolute;
  text-align: center;
  transform: translate(50%, 0);
  white-space: nowrap;
}
.report_page .work_volume_variation_graph .left .horizontal_label .year,
.report_page .work_volume_variation_graph .right .horizontal_label .year {
  display: none;
  font-size: 8px;
}
.report_page .work_volume_variation_graph .left .horizontal_label.year .year,
.report_page .work_volume_variation_graph .right .horizontal_label.year .year {
  display: block;
}
.report_page .work_volume_variation_graph .left .horizontal_label.current,
.report_page .work_volume_variation_graph .right .horizontal_label.current {
  color: #008ffb;
}
.report_page .work_volume_variation_graph .left .past_point,
.report_page .work_volume_variation_graph .right .past_point {
  color: #008ffb;
  display: none;
  font-size: 12px;
  font-weight: bold;
  position: absolute;
  transform: translate(50%, -200%);
}
.report_page .work_volume_variation_graph .left .past_point.current,
.report_page .work_volume_variation_graph .right .past_point.current {
  display: block;
}
.report_page .work_volume_variation_graph .left .past_mark,
.report_page .work_volume_variation_graph .right .past_mark {
  background: #008ffb;
  border-radius: 50%;
  height: 16px;
  position: absolute;
  transform: translate(50%, -50%);
  width: 16px;
  z-index: 2;
}
.report_page .work_volume_variation_graph .left .past_mark_current,
.report_page .work_volume_variation_graph .right .past_mark_current {
  background: #fff;
  border: 3px solid #008ffb;
  border-radius: 100%;
  height: 28px;
  position: absolute;
  transform: translate(50%, -50%);
  width: 28px;
}
.report_page .vertical_ruler {
  position: absolute;
  top: 100%;
  left: 5%;
  width: 4px;
  height: 0;
  background-color: #FFF;
}
.report_page .horizontal_ruler {
  width: 5%;
  height: 4px;
  margin-left: 5%;
  background-color: #FFF;
  transform: translateY(-50%);
}
.report_page .monthly .block-header {
  margin: -8px -8px 24px;
}
.report_page .monthly .block-header .title {
  font-size: 24px;
  color: #666;
}
.report_page .monthly .member_area .manager_card_area {
  padding-bottom: 8px;
  border-bottom: solid 1px #FFF;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.report_page .monthly .member_area .member_card_area {
  padding-top: 16px;
  display: flex;
  flex-wrap: wrap;
}
.report_page .monthly [class$=_card_area] .flex {
  display: flex;
}
.report_page .monthly [class$=_card_area] .score_area {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-top: 16px;
}
.report_page .monthly [class$=_card_area] .score_area .item {
  width: 19%;
  text-align: center;
}
.report_page .monthly [class$=_card_area] .score_area .item .text {
  border-bottom: 1px solid #cccccc;
  font-size: 8px;
  line-height: 1.25;
  color: #4E585D;
  padding-bottom: 4px;
}
.report_page .monthly [class$=_card_area] .score_area .item .point {
  font-size: 14px;
  line-height: 1.25;
  color: #4E585D;
  font-weight: 600;
  padding-top: 4px;
}
.report_page .monthly [class$=_card_area] .button_area {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 24px;
}
.report_page .monthly [class$=_card_area] .button_area button {
  text-align: center;
  border-radius: 4px;
  padding: 8px 16px;
  border: 1px solid #656E73;
  color: #656E73;
  background-color: #FFFFFF;
  font-weight: 600;
}
.report_page .monthly [class$=_card_area] .button_area button:hover {
  background-color: #656E73;
  color: #FFFFFF;
}
.report_page .monthly [class$=_card_area] .member_block {
  width: 32.3%;
  padding: 16px;
  border: solid 1px #CCC;
  border-radius: 8px;
  background-color: #FFFFFF;
  margin: 0px 0.5% 1%;
  position: relative;
}
.report_page .monthly [class$=_card_area] .member_block .total_evaluation {
  position: absolute;
  top: -10px;
  right: 10px;
  font-size: 16px;
  padding: 4px 8px;
  color: #FFFFFF;
}
.report_page .monthly [class$=_card_area] .member_block .user_icon {
  width: 40px;
  height: 40px;
  margin-right: 16px;
  border-radius: 50%;
}
.report_page .monthly [class$=_card_area] .member_block .user_icon img {
  width: 100%;
  border-radius: 50%;
}
.report_page .monthly [class$=_card_area] .member_block .role {
  font-size: 14px;
  line-height: 1.25;
}
.report_page .monthly [class$=_card_area] .member_block .name {
  font-weight: bold;
  font-size: 16px;
  line-height: 1.25;
}
.report_page .monthly [class$=_card_area] .member_block .view_report {
  border: 1px solid #656E73;
  color: #656E73;
  background-color: #FFFFFF;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 12px;
  cursor: pointer;
  margin: 8px 0px 0px;
  text-align: center;
  position: relative;
}
.report_page .monthly [class$=_card_area] .member_block .view_report:hover {
  color: #FFFFFF;
  background-color: #656E73;
}
.report_page .monthly [class$=_card_area] .member_block.manager {
  border: 1px solid #CADFFF;
  background-color: #EDF4FF;
  color: #094E8D;
}
.report_page .monthly .score .header_area {
  display: flex;
  margin-bottom: 16px;
}
.report_page .monthly .score .header_area .prefix {
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.5;
  color: #333333;
  border-right: 1px solid #CCCCCC;
  width: 15%;
  min-height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.report_page .monthly .score .header_area .title {
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.5;
  color: #333333;
  border-right: 1px solid #CCCCCC;
  width: 25%;
  min-height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
}
.report_page .monthly .score .header_area .point {
  text-align: center;
  font-size: 36px;
  font-weight: bold;
  line-height: 1.5;
  color: #333333;
  border-right: 1px solid #CCCCCC;
  width: 10%;
  min-height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.report_page .monthly .score .header_area .description {
  text-align: left;
  font-size: 12px;
  font-weight: normal;
  line-height: 1.65;
  color: #333333;
  width: 50%;
  min-height: 70px;
  display: flex;
  align-items: center;
  padding: 0px 16px;
}
.report_page .monthly .score .ruler_area {
  display: flex;
  align-items: center;
  margin-top: 24px;
  margin-bottom: 24px;
}
.report_page .monthly .score .ruler_area .title {
  width: 200px;
  font-size: 14px;
  color: #8b8b8b;
  text-align: right;
  padding-right: 16px;
}
.report_page .monthly .score .ruler_area .ruler {
  width: 100%;
  position: relative;
}
.report_page .monthly .score .bar_area .item {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}
.report_page .monthly .score .bar_area .item .title {
  width: 200px;
  color: #4E585D;
  font-size: 14px;
  font-weight: 300;
  line-height: 1.65;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.report_page .monthly .score .bar_area .item .title .point {
  margin: 0px 24px 0px 10px;
  width: 40px;
  text-align: right;
  font-size: 16px;
  font-weight: bold;
}
.report_page .monthly .score .bar_area .item .graph_area {
  height: 30px;
  width: 100%;
  background-color: #eaebeb;
  position: relative;
}
.report_page .monthly .score .bar_area .item .graph_area .graph {
  height: 30px;
  background-color: #A8AFB4;
  border-radius: 0 4px 4px 0;
}
.report_page .monthly .score .bar_area .item .graph_area .delimiter {
  display: flex;
  justify-content: space-evenly;
  position: absolute;
  top: 0px;
  width: 100%;
}
.report_page .monthly .score .bar_area .item .graph_area .delimiter div {
  width: 1px;
  height: 30px;
}
.report_page .monthly .score .bar_area .item .graph_area .delimiter div:nth-of-type(2n-1) {
  background-color: #F3F3F3;
}
.report_page .monthly .score .bar_area .item .graph_area .delimiter div:nth-of-type(2n) {
  background-color: #FFFFFF;
}
.report_page .monthly .score .bar_area .item:nth-of-type(1) {
  margin-bottom: 0;
}
.report_page .monthly .score .bar_area .item:nth-of-type(1) .title {
  color: #0A4E8C;
  font-size: 28px;
  font-weight: bold;
}
.report_page .monthly .score .bar_area .item:nth-of-type(1) .point {
  font-size: 28px;
}
.report_page .monthly .score .bar_area .item:nth-of-type(1) .graph_area .graph {
  background-color: #0A4E8C;
}
.report_page .monthly .header_area .title {
  font-size: 30px;
  font-weight: bold;
  color: #333333;
  margin: 0px -8px 16px;
  line-height: 1.5;
}
.report_page .monthly .header_area .description {
  color: #4472ba;
  font-size: 20px;
  margin: 0px -8px 16px;
}
.report_page .monthly .header_area .graph_contents {
  display: flex;
  justify-content: space-between;
  align-items: start;
  margin: 16px -8px 0px;
}
.report_page .monthly .header_area .graph_contents .left_area {
  width: 65%;
}
.report_page .monthly .header_area .graph_contents .left_area .comment_area {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.report_page .monthly .header_area .graph_contents .left_area .comment_area .top_comment {
  font-size: 22px;
  color: #333333;
  margin-bottom: 24px;
  line-height: 1.5;
}
.report_page .monthly .header_area .graph_contents .left_area .comment_area .comment_block {
  margin: 16px 0px;
  line-height: 1.7em;
  min-height: 300px;
  width: 46%;
}
.report_page .monthly .header_area .graph_contents .left_area .comment_area .comment_block .comment_title_area {
  text-align: center;
  margin-bottom: 8px;
  position: relative;
  height: 20px;
  padding: 8px 0px;
}
.report_page .monthly .header_area .graph_contents .left_area .comment_area .comment_block .comment_title_area hr {
  position: absolute;
  top: 50%;
  width: 100%;
  color: #094E8D;
}
.report_page .monthly .header_area .graph_contents .left_area .comment_area .comment_block .comment_title_area .comment_title {
  color: #094E8D;
  background-color: #ffffff;
  font-size: 18px;
  font-weight: bold;
  position: absolute;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  padding: 0px 8px 0px 0px;
}
.report_page .monthly .header_area .graph_contents .left_area .comment_area .comment_block .comment_detail {
  padding: 8px 0px;
  font-size: 15px;
  line-height: 1.65;
  font-weight: 300;
  color: #333333;
}
.report_page .monthly .header_area .graph_contents .left_area .comment_area .comment_block .comment_detail p:nth-child(1) {
  color: #4372BA;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .graph_wrap {
  position: relative;
  width: 46%;
  background-color: #ffffff;
  border-radius: 50%;
  padding: 20px;
  z-index: 1;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .graph_wrap .graph {
  border-radius: 50%;
  position: relative;
  margin: 0px auto;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .graph_wrap .graph .detail {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .graph_wrap .graph .detail .team_icon {
  background-color: #ffffff;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #4372ba;
  font-size: 50px;
  font-weight: bold;
  color: #4372ba;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .graph_wrap .graph .detail .member_icon {
  background-color: #CCCCCC;
  width: 60px;
  height: 60px;
  border-radius: 50%;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .graph_wrap .graph .detail .member_icon img {
  width: 100%;
  border-radius: 50%;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .graph_wrap .graph .detail .date {
  color: #888888;
  margin: 16px 0px 8px;
  width: 100%;
  text-align: center;
  font-size: 16px;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .graph_wrap .graph .detail .score {
  font-size: 44px;
  font-weight: bold;
  color: #4372ba;
  width: 100%;
  text-align: center;
  text-shadow: #ffffff 0px 0px 4px;
  position: relative;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .graph_wrap .graph .detail .score div {
  z-index: 1;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .graph_wrap .graph .detail .score .excellent_ribbon {
  width: 400px;
  position: absolute;
  top: 90%;
  left: 50%;
  z-index: -1;
  transform: translateX(-50%) translateY(-50%);
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .graph_wrap .guard {
  border-radius: 50%;
  position: absolute;
  top: 57px;
  left: 57px;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .icon {
  width: 100%;
  text-align: center;
  margin-top: 8px;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .icon svg {
  width: 40px;
  height: 40px;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .icon.up use {
  fill: #0B9554;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .icon.down use {
  fill: #C61616;
}
.report_page .monthly .header_area .graph_contents .left_area .graph_area .icon.keep use {
  fill: #4372BA;
}
.report_page .monthly .header_area .graph_contents .left_area .radar_area {
  height: 350px;
  width: 46%;
  position: relative;
  margin: 16px 0px 0px;
}
.report_page .monthly .header_area .graph_contents .left_area .radar_area .radar_title_area {
  text-align: center;
  margin-bottom: 8px;
  position: relative;
  height: 20px;
  padding: 8px 0px;
}
.report_page .monthly .header_area .graph_contents .left_area .radar_area .radar_title_area hr {
  position: absolute;
  top: 50%;
  width: 100%;
  color: #094E8D;
}
.report_page .monthly .header_area .graph_contents .left_area .radar_area .radar_title_area .radar_title {
  color: #094E8D;
  background-color: #ffffff;
  font-size: 18px;
  font-weight: bold;
  position: absolute;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  padding: 0px 8px 0px 0px;
}
.report_page .monthly .header_area .graph_contents .left_area .radar_area .radar {
  width: 100%;
  top: -40px;
}
.report_page .monthly .header_area .graph_contents .right_area {
  width: 30%;
}
.report_page .monthly .header_area .graph_contents .right_area .block {
  min-height: 350px;
  margin: 16px 0px;
}
.report_page .monthly .header_area .graph_contents .right_area .block:nth-child(2) {
  min-height: 300px;
}
.report_page .monthly .header_area .graph_contents .right_area .header_text_area {
  text-align: center;
  margin-bottom: 16px;
  position: relative;
  height: 20px;
  padding: 8px 0px;
}
.report_page .monthly .header_area .graph_contents .right_area .header_text_area hr {
  position: absolute;
  top: 50%;
  width: 100%;
  color: #094E8D;
}
.report_page .monthly .header_area .graph_contents .right_area .header_text_area .header_text {
  color: #094E8D;
  background-color: #ffffff;
  font-size: 18px;
  font-weight: bold;
  position: absolute;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  padding: 0px 8px 0px 0px;
}
.report_page .monthly .header_area .graph_contents .right_area .group {
  margin-bottom: 40px;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item_title {
  margin: 8px 0;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item_title a {
  font-size: 14px;
  font-weight: bold;
  color: #777777;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item {
  display: flex;
  align-items: center;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item:nth-of-type(3n-1) {
  position: relative;
  height: 40px;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item:nth-of-type(3n) {
  margin-bottom: 8px;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item .icon_warn {
  position: absolute;
  left: -40px;
  z-index: 1;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item .text_area {
  width: 60px;
  color: #4472BA;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.25;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item .text_area a {
  color: inherit;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item .text_area span {
  margin: 0px 10px;
  color: #4472BA;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item .graph_area {
  height: 30px;
  width: 100%;
  background-color: #ECF0F5;
  position: relative;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item .graph_area .graph {
  height: 30px;
  background-color: #4472BA;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item .graph_area .delimiter {
  display: flex;
  justify-content: space-evenly;
  position: absolute;
  top: 0px;
  width: 100%;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item .graph_area .delimiter div {
  width: 1px;
  height: 30px;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item .graph_area .delimiter div:nth-of-type(2n-1) {
  background-color: #F3F3F3;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item .graph_area .delimiter div:nth-of-type(2n) {
  background-color: #FFFFFF;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item .link_button {
  border-radius: 50%;
  margin-left: 8px;
  width: 30px;
  height: 30px;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  background-color: #4472BA;
  font-size: 22px;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item .label {
  width: 100%;
  height: 16px;
  color: #999999;
  font-size: 10px;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item.checked .text_area {
  color: #FFA800;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item.checked .text_area span {
  color: #FFA800;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item.checked .graph_area .graph {
  background-color: #FFA800;
}
.report_page .monthly .header_area .graph_contents .right_area .group .item.checked .link_button {
  background-color: #FFA800;
}
.report_page .monthly .header_area .down_area {
  display: flex;
  margin: 16px -16px 0;
  justify-content: space-between;
}
.report_page .monthly .header_area .down_area .detail_block {
  border: 1px solid #D5DADF;
  background-color: #FFFFFF;
  padding: 16px 32px;
  border-radius: 8px;
  width: 32%;
  position: relative;
}
.report_page .monthly .header_area .down_area .detail_block .detail_wrap {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.report_page .monthly .header_area .down_area .detail_block .detail_wrap .detail_text_area {
  white-space: nowrap;
  text-align: center;
  min-width: 120px;
}
.report_page .monthly .header_area .down_area .detail_block .detail_wrap .detail_text_area .detail_title {
  text-align: center;
  color: #777777;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 8px;
  position: relative;
  padding-bottom: 8px;
  border-bottom: solid 1px #D0D0D0;
}
.report_page .monthly .header_area .down_area .detail_block .detail_wrap .detail_text_area .detail_title.help {
  cursor: help;
}
.report_page .monthly .header_area .down_area .detail_block .detail_wrap .detail_text_area .detail_title .icon {
  margin-left: 4px;
}
.report_page .monthly .header_area .down_area .detail_block .detail_wrap .detail_text_area .detail_title .tip_wrap {
  position: absolute;
  transform: translateY(-120%) translateX(-50%);
  background-color: #000000;
  color: #FFFFFF;
  padding: 8px;
  border-radius: 4px;
  top: -10px;
  left: 50%;
  z-index: 5;
}
.report_page .monthly .header_area .down_area .detail_block .detail_wrap .detail_text_area .detail_title .tip_wrap .tip {
  position: relative;
  white-space: nowrap;
}
.report_page .monthly .header_area .down_area .detail_block .detail_wrap .detail_text_area .detail_title .tip_wrap .tip::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #000000;
  position: absolute;
  bottom: -13px;
  left: 0;
  right: 0;
  margin: auto;
  transform: rotate(45deg);
  z-index: 0;
}
.report_page .monthly .header_area .down_area .detail_block .detail_wrap .detail_text_area .detail_value {
  text-align: center;
  color: #333333;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 8px;
  display: flex;
  align-items: baseline;
  justify-content: center;
}
.report_page .monthly .header_area .down_area .detail_block .detail_wrap .detail_text_area .detail_value span {
  font-size: 24px;
  margin: 0 2px;
}
.report_page .monthly .header_area .down_area .detail_block .detail_description {
  text-align: center;
  color: #333333;
  font-size: 15px;
  line-height: 1.5;
}
.report_page .monthly .header_area .down_area .detail_block .icon_area {
  margin: 0 8px;
}
.report_page .monthly .header_area .down_area .detail_block .icon_area .icon svg {
  width: 24px;
  height: 24px;
}
.report_page .monthly .header_area .down_area .detail_block .icon_area .icon.up use {
  fill: #0B9554;
}
.report_page .monthly .header_area .down_area .detail_block .icon_area .icon.down use {
  fill: #C61616;
}
.report_page .monthly .header_area .down_area .detail_block .icon_area .icon.keep use {
  fill: #4372BA;
}
.report_page .monthly .header_area .down_area .detail_block button {
  text-align: center;
  color: #FFFFFF;
  border: 1px solid #4472BA;
  border-radius: 4px;
  background-color: #4472BA;
  padding: 8px 16px;
  font-weight: bold;
}
.report_page .monthly .header_area .down_area .detail_block button:hover {
  color: #FFFFFF;
  background-color: #094E8D;
}
.report_page .monthly .header_area .down_area .detail_block.checked .detail_value,
.report_page .monthly .header_area .down_area .detail_block.checked .detail_description {
  color: #FFA800;
}
.report_page .monthly .header_area .down_area .detail_block.checked button {
  color: #4472BA;
  background-color: #FFA800;
  border: 1px solid #FFA800;
}
.report_page .monthly .header_area .down_area .detail_block.checked button:hover {
  background-color: #db8e00;
}
.report_page .monthly .header_area .down_area .detail_block.checked .icon_warn {
  position: absolute;
  top: -15px;
  left: -15px;
  z-index: 5;
}
.report_page .monthly .header_area .down_area .detail_block.checked .check_icon {
  position: absolute;
  top: -10px;
  left: -10px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background-color: #4472BA;
  border: 2px solid #FFF;
  box-shadow: #999 2px 2px 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  font-size: 20px;
}
.report_page .weekly .block-header {
  margin: -8px -8px 24px;
}
.report_page .weekly .block-header .title {
  font-size: 24px;
  color: #666;
}
.report_page .weekly .profile_area {
  position: absolute;
  top: 70px;
  left: 50px;
}
.report_page .weekly .profile_area .block {
  display: flex;
  position: relative;
  width: fit-content;
  align-items: center;
}
.report_page .weekly .profile_area .block .name {
  background-color: #ffffff;
  padding: 0px 8px;
  font-size: 26px;
  font-weight: bold;
  max-width: 250px;
}
.report_page .weekly .profile_area .block .item {
  margin: 0px 8px;
  text-align: center;
  min-width: 60px;
}
.report_page .weekly .profile_area .block .item img {
  width: 40px;
  height: 40px;
  margin: auto;
}
.report_page .weekly .profile_area .block .item .text_area {
  width: 40px;
  height: 40px;
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
  font-size: 16px;
}
.report_page .weekly .profile_area .block .item .item_title {
  margin-top: 4px;
  font-size: 12px;
}
.report_page .weekly .profile_area .block .item .item_title div {
  width: 80px;
  font-size: 10px;
  color: #FFFFFF;
  background-color: #777777;
  padding: 4px 0;
  margin: 0 auto 4px;
}
.report_page .weekly .profile_area_team {
  position: absolute;
  top: 100px;
  left: 70px;
  font-size: 30px;
  font-weight: bold;
  max-width: 400px;
  transform: translateY(-25%);
}
.report_page .weekly .graph_area {
  position: relative;
  margin-top: -40px;
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.report_page .weekly .graph_area .left_graph_item {
  width: 40%;
  height: 350px;
  background-color: #ffffff;
  border-radius: 50%;
  padding: 24px;
  z-index: 0;
  position: relative;
}
.report_page .weekly .graph_area .left_graph_item .bg_border_center {
  width: 100%;
  height: 1px;
  background-color: #4472ba;
  position: absolute;
  top: 50%;
  left: 344px;
  transform: translateY(-50%);
}
.report_page .weekly .graph_area .left_graph_item .bg_circle_center {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background-color: #ffffff;
  border: 1px solid #4472ba;
  position: absolute;
  top: 50%;
  left: 344px;
  transform: translateX(-50%) translateY(-50%);
  z-index: 1;
}
.report_page .weekly .graph_area .left_graph_item .bg_border_up_1 {
  width: 160px;
  height: 1px;
  background-color: #4472ba;
  position: absolute;
  top: 10%;
  left: 270px;
}
.report_page .weekly .graph_area .left_graph_item .bg_border_up_2 {
  position: absolute;
  top: calc(10% + 1px);
  left: 430px;
  width: calc(100% - 300px);
  height: 150px;
  transform: translateY(-100%);
  background: linear-gradient(to right bottom, transparent calc(50% - 1px), #4472ba 50%, transparent calc(50% + 1px));
}
.report_page .weekly .graph_area .left_graph_item .bg_circle_up {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background-color: #ffffff;
  border: 1px solid #4472ba;
  position: absolute;
  top: 10%;
  left: 270px;
  transform: translateX(-50%) translateY(-50%);
  z-index: 1;
}
.report_page .weekly .graph_area .left_graph_item .bg_border_down_1 {
  width: 160px;
  height: 1px;
  background-color: #4472ba;
  position: absolute;
  top: 90%;
  left: 270px;
}
.report_page .weekly .graph_area .left_graph_item .bg_border_down_2 {
  position: absolute;
  bottom: calc(10% + 0px);
  left: 430px;
  width: calc(100% - 300px);
  height: 150px;
  transform: translateY(100%);
  background: linear-gradient(to right top, transparent calc(50% - 1px), #4472ba 50%, transparent calc(50% + 1px));
}
.report_page .weekly .graph_area .left_graph_item .bg_circle_down {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background-color: #ffffff;
  border: 1px solid #4472ba;
  position: absolute;
  top: 90%;
  left: 270px;
  transform: translateX(-50%) translateY(-50%);
  z-index: 1;
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap {
  width: 302px;
  height: 302px;
  border-radius: 50%;
  position: relative;
  padding: 24px;
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .needle {
  height: 2px;
  width: 50%;
  background: linear-gradient(to right, transparent 66%, #333333 66%, transparent 100%);
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  transform-origin: left;
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .bg_shell {
  width: 170px;
  height: 340px;
  border-radius: 0px 250px 250px 0px;
  border-top: 1px dashed #cccccc;
  border-right: 1px dashed #cccccc;
  border-bottom: 1px dashed #cccccc;
  border-left: none;
  border-image: initial;
  position: absolute;
  top: 50%;
  left: 78%;
  transform: translateX(-50%) translateY(-50%);
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .pie {
  width: 302px;
  height: 302px;
  border-radius: 50%;
  position: absolute;
  top: 0px;
  left: 0px;
  opacity: 0.2;
  background-image: radial-gradient(#ffffff 64%, transparent 0%), conic-gradient(from 180deg, #4472BA 0%, #4472BA 18.65%, #ffffff 18.65%, #ffffff 18.85%, #4472BA 18.85%, #4472BA 37.4%, #ffffff 37.4%, #ffffff 37.6%, #4472BA 37.6%, #4472BA 56.15%, #ffffff 56.15%, #ffffff 56.35%, #4472BA 56.35%, #4472BA 75%, #ffffff 75%, #ffffff 100%);
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .ruler {
  width: 254px;
  height: 254px;
  border-radius: 50%;
  position: relative;
  background-image: radial-gradient(#ffffff 55%, transparent 0%), conic-gradient(from 180deg, #ECF0F5 0%, #ECF0F5 18.65%, #ffffff 18.65%, #ffffff 18.85%, #D5DADF 18.85%, #D5DADF 37.4%, #ffffff 37.4%, #ffffff 37.6%, #BFC4C9 37.6%, #BFC4C9 56.15%, #ffffff 56.15%, #ffffff 56.35%, #A8AFB4 56.35%, #A8AFB4 75%, #ffffff 75%, #ffffff 100%);
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .ruler .ruler_item {
  position: absolute;
  font-weight: bold;
  font-size: 14px;
  color: #4E585D;
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .ruler .ruler_item:nth-of-type(1) {
  top: 33%;
  right: -2%;
  transform: rotate(54deg) translateX(-50%) translateY(-50%);
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .ruler .ruler_item:nth-of-type(2) {
  top: 6%;
  right: 44%;
  transform: rotate(-9deg) translateX(-50%) translateY(-50%);
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .ruler .ruler_item:nth-of-type(3) {
  top: 31%;
  left: 6%;
  transform: rotate(-75deg) translateX(-50%) translateY(-50%);
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .ruler .ruler_item:nth-of-type(4) {
  top: 77%;
  left: 17%;
  transform: rotate(-145deg) translateX(-50%) translateY(-50%);
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .ruler .inner_text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .ruler .inner_text .text {
  font-size: 30px;
  font-weight: bold;
  color: #4472BA;
  z-index: 1;
  text-shadow: 0 0 4px #ffffff;
  text-align: center;
  width: 100%;
  margin-top: 8px;
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .ruler .inner_text .team_icon {
  background-color: #ffffff;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #4372ba;
  font-size: 60px;
  font-weight: bold;
  color: #4372ba;
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .ruler .inner_text .member_icon {
  background-color: #CCCCCC;
  width: 80px;
  height: 80px;
  border-radius: 50%;
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .ruler .inner_text .member_icon img {
  width: 100%;
  border-radius: 50%;
}
.report_page .weekly .graph_area .left_graph_item .graph_wrap .ruler .inner_text .excellent_ribbon {
  width: 270px;
  position: absolute;
  top: 85px;
}
.report_page .weekly .graph_area .right_graph_item {
  position: relative;
  width: 50%;
}
.report_page .weekly .graph_area .mini_graph_item {
  background-color: #ffffff;
  border-radius: 50%;
  padding: 16px 24px;
  z-index: 1;
  display: flex;
  align-items: center;
  position: relative;
}
.report_page .weekly .graph_area .mini_graph_item .graph_wrap {
  width: 232px;
  height: 232px;
  border-radius: 50%;
  position: relative;
  padding: 24px;
}
.report_page .weekly .graph_area .mini_graph_item .graph_wrap .needle {
  height: 2px;
  width: 50%;
  background: linear-gradient(to right, transparent 62%, #333333 62%, transparent 100%);
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  transform-origin: left;
}
.report_page .weekly .graph_area .mini_graph_item .graph_wrap .pie {
  width: 232px;
  height: 232px;
  border-radius: 50%;
  position: absolute;
  top: 0px;
  left: 0px;
  opacity: 0.2;
  background-image: radial-gradient(#ffffff 64%, transparent 0%), conic-gradient(from 180deg, #4472BA 0%, #4472BA 18.65%, #ffffff 18.65%, #ffffff 18.85%, #4472BA 18.85%, #4472BA 37.4%, #ffffff 37.4%, #ffffff 37.6%, #4472BA 37.6%, #4472BA 56.15%, #ffffff 56.15%, #ffffff 56.35%, #4472BA 56.35%, #4472BA 75%, #ffffff 75%, #ffffff 100%);
}
.report_page .weekly .graph_area .mini_graph_item .graph_wrap .ruler {
  width: 184px;
  height: 184px;
  border-radius: 50%;
  position: relative;
  background-image: radial-gradient(#ffffff 55%, transparent 0%), conic-gradient(from 180deg, #ECF0F5 0%, #ECF0F5 18.65%, #ffffff 18.65%, #ffffff 18.85%, #D5DADF 18.85%, #D5DADF 37.4%, #ffffff 37.4%, #ffffff 37.6%, #BFC4C9 37.6%, #BFC4C9 56.15%, #ffffff 56.15%, #ffffff 56.35%, #A8AFB4 56.35%, #A8AFB4 75%, #ffffff 75%, #ffffff 100%);
}
.report_page .weekly .graph_area .mini_graph_item .graph_wrap .ruler .ruler_item {
  position: absolute;
  font-weight: bold;
  font-size: 14px;
  color: #4E585D;
}
.report_page .weekly .graph_area .mini_graph_item .graph_wrap .ruler .ruler_item:nth-of-type(1) {
  top: 45%;
  right: 4%;
  transform: rotate(83deg) translateX(-50%) translateY(-50%);
}
.report_page .weekly .graph_area .mini_graph_item .graph_wrap .ruler .ruler_item:nth-of-type(2) {
  top: 11%;
  right: 27.5%;
  transform: rotate(20deg) translateX(-50%) translateY(-50%);
}
.report_page .weekly .graph_area .mini_graph_item .graph_wrap .ruler .ruler_item:nth-of-type(3) {
  top: 15%;
  right: 73%;
  transform: rotate(-45deg) translateX(-50%) translateY(-50%);
}
.report_page .weekly .graph_area .mini_graph_item .graph_wrap .ruler .ruler_item:nth-of-type(4) {
  top: 59%;
  right: 86%;
  transform: rotate(-115deg) translateX(-50%) translateY(-50%);
}
.report_page .weekly .graph_area .mini_graph_item .graph_wrap .ruler .ruler_item:nth-of-type(5) {
  top: 91%;
  right: 51%;
}
.report_page .weekly .graph_area .mini_graph_item .graph_wrap .ruler .inner_text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.report_page .weekly .graph_area .mini_graph_item .graph_wrap .ruler .inner_text .text {
  font-size: 13px;
  font-weight: bold;
  color: #777777;
}
.report_page .weekly .graph_area .mini_graph_item .graph_wrap .ruler .inner_text .point {
  font-size: 40px;
  font-weight: bold;
  color: #094E8D;
}
.report_page .weekly .graph_area .mini_graph_item .text_box {
  background-color: #FFFFFF;
  border: 1px solid #4472BA;
  text-align: left;
  width: 300px;
  min-height: 100px;
  border-radius: 6px;
  z-index: 2;
  padding: 16px;
  font-size: 12px;
  color: #094E8D;
  line-height: 1.5;
  margin-left: 24px;
  position: relative;
}
.report_page .weekly .graph_area .mini_graph_item .text_box .link_button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80%;
  margin: 8px auto 0px;
  border-radius: 4px;
  padding: 8px 16px;
  border: 1px solid #4472BA;
  color: #FFFFFF;
  background-color: #4472BA;
  font-weight: bold;
}
.report_page .weekly .graph_area .mini_graph_item .text_box .link_button:hover {
  color: #FFFFFF;
  background-color: #094E8D;
}
.report_page .weekly .graph_area .mini_graph_item.checked .graph_wrap .pie {
  background-image: radial-gradient(#ffffff 64%, transparent 0%), conic-gradient(from 180deg, #FFA800 0%, #FFA800 18.65%, #ffffff 18.65%, #ffffff 18.85%, #FFA800 18.85%, #FFA800 37.4%, #ffffff 37.4%, #ffffff 37.6%, #FFA800 37.6%, #FFA800 56.15%, #ffffff 56.15%, #ffffff 56.35%, #FFA800 56.35%, #FFA800 75%, #ffffff 75%, #ffffff 100%);
}
.report_page .weekly .graph_area .mini_graph_item.checked .graph_wrap .ruler {
  background-image: radial-gradient(#ffffff 55%, transparent 0%), conic-gradient(from 180deg, #ECF0F5 0%, #ECF0F5 18.65%, #ffffff 18.65%, #ffffff 18.85%, #D5DADF 18.85%, #D5DADF 37.4%, #ffffff 37.4%, #ffffff 37.6%, #BFC4C9 37.6%, #BFC4C9 56.15%, #ffffff 56.15%, #ffffff 56.35%, #A8AFB4 56.35%, #A8AFB4 75%, #ffffff 75%, #ffffff 100%);
}
.report_page .weekly .graph_area .mini_graph_item.checked .graph_wrap .ruler .ruler_item {
  color: #4E585D;
}
.report_page .weekly .graph_area .mini_graph_item.checked .graph_wrap .ruler .inner_text .point {
  color: #FFA800;
}
.report_page .weekly .graph_area .mini_graph_item.checked .text_box {
  background-color: #fcf6ea;
  border: 1px solid #FFA800;
  color: #4472BA;
}
.report_page .weekly .graph_area .mini_graph_item.checked .text_box .link_button {
  color: #4472BA;
  background-color: #FFA800;
  border: 1px solid #4472BA;
}
.report_page .weekly .graph_area .mini_graph_item.checked .text_box .link_button:hover {
  color: #4472BA;
  background-color: #db8e00;
}
.report_page .weekly .graph_area .mini_graph_item.checked .text_box .icon_warn {
  position: absolute;
  top: -17px;
  left: -17px;
}
.report_page .weekly .member_area .manager_card_area {
  padding-bottom: 8px;
  border-bottom: solid 1px #FFF;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.report_page .weekly .member_area .member_card_area {
  padding-top: 16px;
  display: flex;
  flex-wrap: wrap;
}
.report_page .weekly [class$=_card_area] .flex {
  display: flex;
}
.report_page .weekly [class$=_card_area] .score_area {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-top: 16px;
}
.report_page .weekly [class$=_card_area] .score_area .item {
  width: 30%;
  text-align: center;
}
.report_page .weekly [class$=_card_area] .score_area .item .text {
  border-bottom: 1px solid #cccccc;
  font-size: 8px;
  line-height: 1.25;
  color: #4E585D;
  padding-bottom: 4px;
}
.report_page .weekly [class$=_card_area] .score_area .item .point {
  font-size: 14px;
  line-height: 1.25;
  color: #4E585D;
  font-weight: 600;
  padding-top: 4px;
}
.report_page .weekly [class$=_card_area] .button_area {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 24px;
}
.report_page .weekly [class$=_card_area] .button_area button {
  text-align: center;
  border-radius: 4px;
  padding: 8px 16px;
  border: 1px solid #656E73;
  color: #656E73;
  background-color: #FFFFFF;
  font-weight: 600;
}
.report_page .weekly [class$=_card_area] .button_area button:hover {
  background-color: #656E73;
  color: #FFFFFF;
}
.report_page .weekly [class$=_card_area] .member_block {
  width: 32.3%;
  padding: 16px;
  border: solid 1px #CCC;
  border-radius: 8px;
  background-color: #FFFFFF;
  margin: 0px 0.5% 1%;
  position: relative;
}
.report_page .weekly [class$=_card_area] .member_block .total_evaluation {
  position: absolute;
  top: -10px;
  right: 10px;
  font-size: 16px;
  padding: 4px 8px;
  color: #FFFFFF;
}
.report_page .weekly [class$=_card_area] .member_block .user_icon {
  width: 40px;
  height: 40px;
  margin-right: 16px;
  border-radius: 50%;
}
.report_page .weekly [class$=_card_area] .member_block .user_icon img {
  width: 100%;
  border-radius: 50%;
}
.report_page .weekly [class$=_card_area] .member_block .role {
  font-size: 14px;
  line-height: 1.25;
}
.report_page .weekly [class$=_card_area] .member_block .name {
  font-weight: bold;
  font-size: 16px;
  line-height: 1.25;
}
.report_page .weekly [class$=_card_area] .member_block .view_report {
  border: 1px solid #656E73;
  color: #656E73;
  background-color: #FFFFFF;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 12px;
  cursor: pointer;
  margin: 8px 0px 0px;
  text-align: center;
  position: relative;
}
.report_page .weekly [class$=_card_area] .member_block .view_report:hover {
  color: #FFFFFF;
  background-color: #656E73;
}
.report_page .weekly [class$=_card_area] .member_block.manager {
  border: 1px solid #CADFFF;
  background-color: #EDF4FF;
  color: #094E8D;
}
.report_page .weekly .score .header_area {
  display: flex;
  margin-bottom: 16px;
}
.report_page .weekly .score .header_area .title {
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.5;
  color: #333333;
  border-right: 1px solid #CCCCCC;
  width: 25%;
  min-height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
}
.report_page .weekly .score .header_area .point {
  text-align: center;
  font-size: 36px;
  font-weight: 600;
  line-height: 1.5;
  color: #333333;
  border-right: 1px solid #CCCCCC;
  width: 10%;
  min-height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.report_page .weekly .score .header_area .description {
  text-align: left;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.65;
  color: #333333;
  width: 50%;
  min-height: 70px;
  display: flex;
  align-items: center;
  padding: 0px 16px;
}
.report_page .weekly .score .ruler_area {
  display: flex;
  align-items: center;
  margin-top: 24px;
  margin-bottom: 24px;
}
.report_page .weekly .score .ruler_area .title {
  width: 200px;
  font-size: 20px;
  color: #8b8b8b;
  text-align: right;
  padding-right: 16px;
}
.report_page .weekly .score .ruler_area .ruler {
  width: 100%;
  position: relative;
}
.report_page .weekly .score .bar_area .item {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}
.report_page .weekly .score .bar_area .item .title {
  width: 200px;
  color: #4E585D;
  font-size: 14px;
  font-weight: 300;
  line-height: 1.65;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.report_page .weekly .score .bar_area .item .title .point {
  margin: 0px 24px 0px 10px;
  width: 40px;
  text-align: right;
  font-size: 16px;
  font-weight: bold;
}
.report_page .weekly .score .bar_area .item .graph_area {
  height: 30px;
  width: 100%;
  position: relative;
  margin-bottom: 0;
  margin-top: 0;
  display: block;
  background: linear-gradient(to right, #eaebeb 60%, #F5F8FB 60%);
}
.report_page .weekly .score .bar_area .item .graph_area .graph {
  height: 30px;
  background-color: #A8AFB4;
  border-radius: 0 4px 4px 0;
}
.report_page .weekly .score .bar_area .item .graph_area .delimiter {
  display: flex;
  justify-content: space-evenly;
  position: absolute;
  top: 0px;
  width: 100%;
}
.report_page .weekly .score .bar_area .item .graph_area .delimiter div {
  width: 1px;
  height: 30px;
  background-color: transparent;
}
.report_page .weekly .score .bar_area .item .graph_area .delimiter div:nth-of-type(2), .report_page .weekly .score .bar_area .item .graph_area .delimiter div:nth-of-type(6) {
  background-color: #FFFFFF;
}
.report_page .weekly .score .bar_area .item:nth-of-type(1) {
  margin-bottom: 0;
}
.report_page .weekly .score .bar_area .item:nth-of-type(1) .title {
  color: #0A4E8C;
  font-size: 28px;
  font-weight: bold;
}
.report_page .weekly .score .bar_area .item:nth-of-type(1) .point {
  font-size: 28px;
}
.report_page .weekly .score .bar_area .item:nth-of-type(1) .graph_area .graph {
  background-color: #0A4E8C;
}
.report_page .weekly .header_area .title {
  font-size: 30px;
  font-weight: bold;
  color: #666;
}
.report_page .weekly .header_area .graph_contents {
  display: flex;
  margin: 16px -16px 0px;
}
.report_page .weekly .header_area .graph_contents .left_area {
  width: 68%;
  display: flex;
  flex-direction: column;
}
.report_page .weekly .header_area .graph_contents .left_area .up_area {
  width: 100%;
  display: flex;
  margin-bottom: 90px;
}
.report_page .weekly .header_area .graph_contents .left_area .up_area .comment_area {
  width: 37%;
}
.report_page .weekly .header_area .graph_contents .left_area .up_area .comment_area .top_comment {
  font-size: 22px;
  color: #666;
  margin-bottom: 24px;
}
.report_page .weekly .header_area .graph_contents .left_area .up_area .comment_area .comment_block {
  width: 80%;
  margin: 8px 0px;
  line-height: 1.7em;
}
.report_page .weekly .header_area .graph_contents .left_area .up_area .comment_area .comment_block .comment_title {
  font-size: 16px;
  font-weight: bold;
  border-bottom: 1px solid #4472BA;
  padding: 8px 0px;
  color: #4472BA;
}
.report_page .weekly .header_area .graph_contents .left_area .up_area .comment_area .comment_block .comment {
  padding: 8px 0px;
}
.report_page .weekly .header_area .graph_contents .left_area .up_area .graph_area {
  width: 63%;
  height: 400px;
}
.report_page .weekly .header_area .down_area {
  position: absolute;
  bottom: 20px;
  left: 80px;
}
.report_page .weekly .header_area .down_area .detail_block {
  padding: 4px 32px;
  margin-right: 16px;
  border-radius: 8px;
  position: relative;
  display: flex;
  align-items: center;
}
.report_page .weekly .header_area .down_area .detail_block .detail_title {
  position: relative;
  text-align: center;
  color: #333333;
  font-size: 14px;
  margin-bottom: 8px;
  padding-bottom: 8px;
  border-bottom: solid 1px #333333;
}
.report_page .weekly .header_area .down_area .detail_block .detail_title.help {
  cursor: help;
}
.report_page .weekly .header_area .down_area .detail_block .detail_title .icon {
  margin-left: 4px;
}
.report_page .weekly .header_area .down_area .detail_block .detail_title .tip_wrap {
  position: absolute;
  transform: translateY(-180%) translateX(-50%);
  background-color: #000000;
  color: #FFFFFF;
  padding: 8px;
  border-radius: 4px;
  top: 10px;
  left: 50%;
  font-size: 10px;
}
.report_page .weekly .header_area .down_area .detail_block .detail_title .tip_wrap .tip {
  position: relative;
  white-space: nowrap;
}
.report_page .weekly .header_area .down_area .detail_block .detail_title .tip_wrap .tip::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #000000;
  position: absolute;
  bottom: -13px;
  left: 0;
  right: 0;
  margin: auto;
  transform: rotate(45deg);
  z-index: 0;
}
.report_page .weekly .header_area .down_area .detail_block .detail_value {
  text-align: center;
  color: #333333;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 8px;
}
.report_page .weekly .header_area .down_area .detail_block .detail_value span {
  font-size: 24px;
  margin: 0 2px;
}
.report_page .weekly .header_area .down_area .detail_block .detail_description {
  text-align: center;
  color: #333333;
  font-size: 12px;
  line-height: 1.5;
  margin-bottom: 8px;
}
.report_page .weekly .header_area .down_area .detail_block .icon_area {
  margin: 0 16px;
  min-width: 24px;
}
.report_page .weekly .header_area .down_area .detail_block .icon_area .icon svg {
  width: 24px;
  height: 24px;
}
.report_page .weekly .header_area .down_area .detail_block .icon_area .icon.up use {
  fill: #0B9554;
}
.report_page .weekly .header_area .down_area .detail_block .icon_area .icon.down use {
  fill: #C61616;
}
.report_page .weekly .header_area .down_area .detail_block .icon_area .icon.keep use {
  fill: #4372BA;
}
.report_page .weekly .header_area .down_area .detail_block button {
  text-align: center;
  color: #FFFFFF;
  border: 1px solid #4472BA;
  border-radius: 4px;
  background-color: #4472BA;
  margin-top: 8px;
  padding: 8px 16px;
  width: 100%;
}
.report_page .weekly .header_area .down_area .detail_block button:hover {
  color: #FFFFFF;
  background-color: #094E8D;
}
.report_page .weekly .header_area .down_area .detail_block.checked .detail_value,
.report_page .weekly .header_area .down_area .detail_block.checked .detail_description {
  font-weight: bold;
  color: #FFA800;
}
.report_page .weekly .header_area .down_area .detail_block.checked button {
  color: #4472BA;
  background-color: #FFA800;
  border: 1px solid #4472BA;
}
.report_page .weekly .header_area .down_area .detail_block.checked button:hover {
  background-color: #db8e00;
}
.report_page .weekly .header_area .down_area .detail_block.checked .icon_warn {
  position: absolute;
  top: -15px;
  left: -15px;
}
.report_page .weekly .header_area .down_area .detail_block.checked .check_icon {
  position: absolute;
  top: -10px;
  left: -10px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background-color: #4472BA;
  border: 2px solid #FFF;
  box-shadow: #999 2px 2px 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  font-size: 20px;
}
.report_page .list_box {
  padding: 24px 24px 0;
  box-shadow: 0 0 12px #CCC;
}
.report_page .list_box .new {
  background-color: #FF4560;
  color: #FFFFFF;
  font-size: 10px;
  padding: 2px 4px;
  margin-left: 4px;
  border-radius: 4px;
}
.report_page .list_box .content-block {
  padding: 24px 0 0;
}
.report_page .list_box .content-block .title {
  min-width: max-content;
  font-size: 24px;
}
.report_page .list_box .block-header {
  align-items: flex-start;
}
.report_page .list_box .block-header.members {
  margin-top: 24px;
  display: flex;
  justify-content: left;
  align-items: center;
  cursor: pointer;
  margin-bottom: 0;
  padding-bottom: 24px;
}
.report_page .list_box .block-header.members .title {
  margin-bottom: 0;
}
.report_page .list_box .block-header.members .icon {
  font-size: 20px;
  margin-left: 8px;
}
.report_page .list_box .block-header .weekly_list {
  display: flex;
  align-items: flex-start;
}
.report_page .list_box .block-header .weekly_list .change_month {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 20px;
}
.report_page .list_box .block-header .weekly_list .graph_area {
  display: flex;
  position: relative;
  margin: 0 16px;
}
.report_page .list_box .block-header .weekly_list .graph_area .line {
  position: absolute;
  width: 100%;
  height: 3px;
  background-color: #4472BA;
  top: 14px;
  z-index: 0;
}
.report_page .list_box .block-header .weekly_list .graph_area .block {
  margin: 0 24px;
  z-index: 0;
  width: 120px;
}
.report_page .list_box .block-header .weekly_list .graph_area .block .check {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background-color: #4472BA;
  border: solid 2px #FFF;
  box-shadow: 0 0 6px #4472BA;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  font-size: 16px;
  margin: auto;
  cursor: pointer;
}
.report_page .list_box .block-header .weekly_list .graph_area .block .check .tip_wrap {
  position: absolute;
  background-color: #666;
  font-size: 12px;
  padding: 8px;
  border-radius: 4px;
  top: -40px;
  z-index: 2;
  visibility: hidden;
  opacity: 0;
  transition: 0.3s ease;
}
.report_page .list_box .block-header .weekly_list .graph_area .block .check .tip_wrap .tip {
  position: relative;
}
.report_page .list_box .block-header .weekly_list .graph_area .block .check .tip_wrap .tip::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #666;
  position: absolute;
  bottom: -13px;
  right: 0;
  left: 0;
  margin: auto;
  transform: rotate(45deg);
  z-index: -1;
}
.report_page .list_box .block-header .weekly_list .graph_area .block .check:hover {
  background-color: #094e8d;
}
.report_page .list_box .block-header .weekly_list .graph_area .block .check:hover .tip_wrap {
  visibility: visible;
  opacity: 1;
}
.report_page .list_box .block-header .weekly_list .graph_area .block .no_check {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #FFFFFF;
  border: solid 1px #4472BA;
  margin: 0 auto 10px;
}
.report_page .list_box .block-header .weekly_list .graph_area .block .text_area {
  text-align: center;
  margin: 8px 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.report_page .list_box .block-header .weekly_list .graph_area .block button.view_report {
  border: solid 1px #656E73;
  color: #656E73;
  background-color: #FFFFFF;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 12px;
}
.report_page .list_box .block-header .weekly_list .graph_area .block button.view_report:hover {
  color: #FFFFFF;
  background-color: #656E73;
}
.report_page .list_box .block-detail {
  background-color: #F3F3F3;
  margin: 0 -48px;
  padding: 48px;
  border-top: solid 1px #DDD;
  border-bottom: solid 1px #DDD;
}
.report_page .list_box .block-detail.member {
  border-top: none;
}
.report_page .list_box .block-detail .card_area {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: space-between;
}
.report_page .list_box .block-detail .card_area .card_detail {
  border: solid 1px #CCC;
  padding: 16px;
  width: calc(16.6666666667% - 16px);
  background-color: #FFF;
  border-radius: 8px;
  margin-bottom: 16px;
}
.report_page .list_box .block-detail .card_area .card_detail.opa_0_5 {
  opacity: 0.5;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap {
  position: relative;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .card_title {
  margin: 8px 8px 16px;
  font-weight: bold;
  display: flex;
  align-items: center;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .view_report {
  border: 1px solid #D5DADF;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 12px;
  cursor: pointer;
  margin: 8px;
  text-align: center;
  position: relative;
  color: #4E585D;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .view_report.not {
  cursor: not-allowed;
  color: #CCC;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .view_report:hover {
  color: #FFFFFF;
  background-color: #4E585D;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .report_list {
  position: absolute;
  border: 1px solid #CCC;
  background-color: #FFF;
  z-index: 2004;
  top: 70px;
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  width: 100%;
  min-width: 210px;
  transform: translateX(-50%);
  left: 50%;
  border-radius: 4px;
  color: #656E73;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .report_list .title {
  font-weight: bold;
  padding: 8px;
  font-size: 12px;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .report_list .report_list_row {
  width: 100%;
  padding: 8px 8px 8px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .report_list .report_list_row .text {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 90%;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .report_list .report_list_row .icon {
  display: none;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .report_list .report_list_row:hover {
  background-color: #ECF0F5;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .report_list .report_list_row:hover .icon {
  display: block;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .graph_wrap {
  margin: 16px auto;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .graph_wrap .created {
  width: 128px;
  height: 128px;
  border-radius: 50%;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  font-size: 18px;
  font-weight: bold;
  cursor: pointer;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .graph_wrap .created .tip_wrap {
  position: absolute;
  background-color: #666;
  font-size: 12px;
  padding: 8px;
  border-radius: 4px;
  top: -15px;
  z-index: 2;
  visibility: hidden;
  opacity: 0;
  transition: 0.3s ease;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .graph_wrap .created .tip_wrap .tip {
  position: relative;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .graph_wrap .created .tip_wrap .tip::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #666;
  position: absolute;
  bottom: -13px;
  right: 0;
  left: 0;
  margin: auto;
  transform: rotate(45deg);
  z-index: -1;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .graph_wrap .created:hover {
  opacity: 0.7;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .graph_wrap .created:hover .tip_wrap {
  visibility: visible;
  opacity: 1;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .graph_wrap .not_created {
  width: 128px;
  height: 128px;
  border-radius: 50%;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 16px solid #EEE;
  color: #CCC;
  font-size: 16px;
  font-weight: bold;
}
.report_page .list_box .block-detail .card_area .card_detail .card_wrap .graph_wrap .making {
  width: 128px;
  height: 128px;
  background-color: #FFF;
  border-radius: 50%;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  flex-flow: column;
}
.report_page .list_box .block-detail .manager_card_area {
  padding-bottom: 8px;
  border-bottom: solid 1px #FFF;
  display: flex;
  flex-wrap: wrap;
}
.report_page .list_box .block-detail .member_card_area {
  padding-top: 16px;
  display: flex;
  flex-wrap: wrap;
}
.report_page .list_box .block-detail [class$=_card_area] .member_block {
  width: 24%;
  padding: 16px;
  border: solid 1px #CCC;
  border-radius: 8px;
  background-color: #FFFFFF;
  display: flex;
  align-items: flex-start;
  margin: 0px 0.5% 1%;
}
.report_page .list_box .block-detail [class$=_card_area] .member_block .user_icon {
  width: 40px;
  height: 40px;
  margin-right: 16px;
  border-radius: 50%;
}
.report_page .list_box .block-detail [class$=_card_area] .member_block .user_icon img {
  width: 100%;
  border-radius: 50%;
}
.report_page .list_box .block-detail [class$=_card_area] .member_block .role {
  font-size: 14px;
  line-height: 1.3em;
}
.report_page .list_box .block-detail [class$=_card_area] .member_block .name {
  font-weight: bold;
  font-size: 16px;
  line-height: 1.4em;
}
.report_page .list_box .block-detail [class$=_card_area] .member_block .view_report {
  border: 1px solid #656E73;
  color: #656E73;
  background-color: #FFFFFF;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 12px;
  cursor: pointer;
  margin: 8px 0px 0px;
  text-align: center;
  position: relative;
}
.report_page .list_box .block-detail [class$=_card_area] .member_block .view_report:hover {
  color: #FFFFFF;
  background-color: #656E73;
}
.report_page .list_box .block-detail [class$=_card_area] .member_block.manager {
  border: 1px solid #CADFFF;
  background-color: #EDF4FF;
  color: #094E8D;
}
.report_page .list_box .browse {
  position: absolute;
  background-color: #FFFFFF;
  border: 1px solid #D5DADF;
  border-radius: 4px;
  z-index: 2001;
  padding: 24px;
  transform: translateX(-50%) translateY(0%);
}
.report_page .list_box .browse .title {
  font-size: 16px;
  color: #4472ba;
  margin-bottom: 16px;
}
.report_page .list_box .browse table tr:nth-of-type(1) {
  border-top: 1px solid #CCCCCC;
  border-bottom: 1px solid #CCCCCC;
}
.report_page .list_box .browse table tr:nth-of-type(2n + 3) {
  background-color: #F5F5F5;
}
.report_page .list_box .browse table tr th,
.report_page .list_box .browse table tr td {
  padding: 16px;
  min-width: 150px;
}
.report_page .judgement_area {
  display: flex;
  align-items: center;
  margin: 16px 0px;
  position: relative;
}
.report_page .judgement_area .text_area {
  width: 200px;
}
.report_page .judgement_area .text_area .text {
  font-size: 14px;
  font-weight: bold;
  color: #333333;
}
.report_page .judgement_area .text_area button {
  text-align: center;
  border-radius: 4px;
  background-color: #FFFFFF;
  width: 80%;
  font-size: 10px;
  display: block;
  margin-top: 4px;
  padding: 4px 8px;
  border: 1px solid #656E73;
  color: #656E73;
  font-weight: bold;
}
.report_page .judgement_area .text_area button:hover {
  background-color: #656E73;
  color: #FFFFFF;
}
.report_page .judgement_area .graph_wrap {
  width: calc(100% - 200px);
  position: relative;
}
.report_page .judgement_area .graph_wrap .graph_area {
  height: 30px;
  width: 100%;
  background-color: #eaebeb;
  position: relative;
}
.report_page .judgement_area .graph_wrap .graph_area .graph {
  height: 30px;
  background-color: #A8AFB4;
  border-radius: 0px 4px 4px 0px;
}
.report_page .judgement_area .graph_wrap .graph_area .delimiter {
  display: flex;
  justify-content: space-evenly;
  position: absolute;
  top: 0px;
  width: 100%;
}
.report_page .judgement_area .graph_wrap .graph_area .delimiter div {
  width: 1px;
  height: 30px;
  background-color: #f3f3f3;
}
.report_page .judgement_area .graph_wrap .graph_area .delimiter div:nth-of-type(2n) {
  background-color: #FFFFFF;
}
.report_page .judgement_area .graph_wrap .value {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  white-space: nowrap;
  font-size: 20px;
  font-weight: bold;
  margin-right: 4px;
  color: #4E585D;
}
.report_page .judgement_area .icon_warn {
  position: absolute;
  left: -45px;
}
.report_page .judgement_area.checked .text_area .text {
  color: #094E8D;
}
.report_page .judgement_area.checked .text_area button {
  background-color: #4472BA;
  color: #FFFFFF;
}
.report_page .judgement_area.checked .text_area button:hover {
  background-color: #094E8D;
  color: #FFFFFF;
}
.report_page .judgement_area.checked .graph_wrap .graph_area .graph {
  background-color: #094E8D;
}
.report_page .judgement_area.checked .graph_wrap .value {
  color: #094E8D;
}
.report_page .legacy_graph_button_area {
  text-align: center;
}
.report_page .legacy_graph_button_area button {
  border-radius: 4px;
  background-color: #FFFFFF;
  padding: 8px 16px;
  border: 1px solid #656E73;
  color: #656E73;
  font-weight: 600;
}
.report_page .legacy_graph_button_area button:hover {
  background-color: #656E73;
  color: #FFFFFF;
}
.report_page .spacer {
  width: 1px;
  height: 30px;
  background-color: #CCC;
  margin: 0 16px;
}

.summary_page .modal_box {
  margin-top: 80px;
}
.summary_page .modal_box .modal_header {
  padding: 32px;
  border-bottom: none;
}
.summary_page .modal_box .modal_header .title {
  font-size: 20px;
  font-weight: bold;
}
.summary_page .modal_box .modal_header .close_modal {
  position: absolute;
  top: -25px;
  right: -10px;
  font-size: 40px;
  border: none;
  background-color: transparent;
  transform: translateY(-50%);
  color: #FFF;
}
.summary_page .modal_box .modal_body {
  max-height: 70vh;
  background-color: #ECF0F4;
  border-radius: 0 0 8px 8px;
}
.summary_page .modal_box.report_modal {
  width: 1200px;
}
.summary_page .modal_box.report_modal.weekly {
  width: 600px;
}
.summary_page .page_header .report_title {
  font-size: 30px;
  color: #666666;
}
.summary_page .user_data_table {
  width: 100%;
}
.summary_page .user_data_table .table-header {
  width: 20%;
  padding-left: 8px;
  padding-bottom: 8px;
  padding-top: 8px;
  font-size: 14px;
  font-weight: bold;
  color: rgba(51, 51, 51, 0.85);
}
.summary_page .user_data_table .table-header:last-child {
  width: 20%;
}
.summary_page .user_data_table .table-header .info_icon {
  margin-left: 4px;
  vertical-align: text-top;
  color: #094e8d;
}
.summary_page .user_data_table thead tr {
  border-bottom: 1px solid #F5F5F5;
}
.summary_page .user_data_table tr {
  background-color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.summary_page .user_data_table tr:nth-child(even) {
  background-color: #F5F5F5;
}
.summary_page .user_data_table .table-body {
  width: 20%;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left: 8px;
  padding-right: 8px;
}
.summary_page .user_data_table .table-body .past_text {
  font-size: 14px;
  color: #cccccc;
}
.summary_page .user_data_table .table-body .information {
  display: table;
  line-height: 26px;
}
.summary_page .user_data_table .table-body .information .text {
  display: table-cell;
  font-size: 14px;
  color: #cccccc;
  vertical-align: middle;
}
.summary_page .user_data_table .table-body .information [class^=compare] + .text {
  padding-left: 8px;
}
.summary_page .user_data_table .table-body .information[lang=en] {
  margin-top: 10px;
  margin-bottom: 18px;
}
.summary_page .user_data_table .table-body .value {
  line-height: 30px;
  margin-top: 8px;
}
.summary_page .user_data_table .table-body .value .text {
  font-size: 24px;
  font-weight: bold;
}
.summary_page .user_data_table .table-body-name {
  width: 9em;
  margin: 0;
  font-size: 16px;
  font-weight: bold;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  display: flex;
  align-items: center;
}
.summary_page .user_data_table .profile_icon {
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin-right: 10px;
}
.summary_page .summary_wrap {
  border-radius: 4px;
  background-color: #F3F3F3;
  padding: 40px 40px 1px;
  box-shadow: 0 0 4px #ccc;
}
.summary_page .summary_wrap .summary_title {
  background-color: #FFF;
  margin: -40px -40px 40px;
  padding: 40px;
  border-radius: 4px 4px 0 0;
  display: flex;
  align-items: center;
  font-size: 24px;
  font-weight: bold;
}
.summary_page .summary_wrap .summary_title .profile_icon {
  border-radius: 50%;
  width: 40px;
  height: 40px;
  margin-right: 10px;
}
.summary_page .summary_wrap .content-block {
  padding: 0;
  margin: 0;
}
.summary_page .summary_wrap .content-block .block-header .title {
  font-size: 24px;
}
.summary_page .page_contents {
  box-shadow: 0px 0px 32px rgba(204, 204, 204, 0.08);
}
.summary_page .summary .summary_title {
  font-size: 24px;
  margin: 0 0 24px;
  padding: 0;
  text-align: center;
  font-weight: bold;
}
.summary_page .summary .category_title_area {
  margin: 0px 16px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.summary_page .summary .category_title_area .category_title {
  font-size: 18px;
  font-weight: bold;
  color: #666666;
}
.summary_page .summary .category_title_area .switch_area {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 8px 12px;
  border-radius: 20px;
  background-color: #e5e5e5;
  font-size: 12px;
}
.summary_page .summary .category_title_area .switch_area button {
  padding: 4px 8px;
  border-radius: 20px;
  background-color: #ffffff;
  color: #666666;
}
.summary_page .summary .category_title_area .switch_area button.select {
  background-color: #094f8c;
  color: #ffffff;
}
.summary_page .summary .list_area {
  margin: 0px 16px;
  border: 2px solid #4372ba;
  border-radius: 4px;
  padding: 16px;
}
.summary_page .summary .list_area .legend_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.summary_page .summary .list_area .legend_area .legend {
  display: flex;
  align-items: center;
  gap: 2px;
  cursor: pointer;
}
.summary_page .summary .list_area .legend_area .legend .color_box {
  width: 16px;
  height: 16px;
}
.summary_page .summary .list_area .list_row {
  display: flex;
  align-items: center;
  margin: 16px 0px;
}
.summary_page .summary .list_area .list_row .name_area {
  width: 20%;
  font-size: 16px;
  font-weight: bold;
  display: flex;
  align-items: center;
}
.summary_page .summary .list_area .list_row .name_area.transparent {
  opacity: 0.2;
}
.summary_page .summary .list_area .list_row .graph_area {
  display: flex;
  width: 80%;
  height: 40px;
}
.summary_page .summary .list_area .list_row .graph_area .graph_wrap {
  display: flex;
}
.summary_page .summary .list_area .list_row .graph_area .graph_wrap .graph_detail {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: default;
}
.summary_page .summary .list_area .list_row .graph_area .graph_wrap .graph_detail.transparent {
  opacity: 0.2;
}
.summary_page .summary .list_area .list_row .graph_area .graph_wrap .graph_detail .graph_text {
  filter: invert(100%) grayscale(100%) contrast(100);
  font-size: 16px;
  text-align: center;
}
.summary_page .summary .list_area .ruler_area {
  width: 80%;
  position: relative;
  height: 8px;
  border-top: 1px solid #999999;
  color: #999999;
  margin-left: 20%;
}
.summary_page .summary .list_area .ruler_area .scale_area {
  position: absolute;
  transform: translateX(-50%);
}
.summary_page .summary .list_area .ruler_area .scale_area .scale {
  position: absolute;
  top: -8px;
  left: 50%;
  height: 8px;
  width: 1px;
  background-color: #999999;
}
.summary_page .summary .summary_block {
  display: flex;
  margin-bottom: 40px;
  margin-top: 40px;
  gap: 80px;
  padding: 0px 16px 0px 40px;
}
.summary_page .summary .summary_block .ranking_block {
  border: 2px solid #4372ba;
  border-radius: 4px;
  padding: 16px;
  display: flex;
  flex-flow: column;
}
.summary_page .summary .summary_block .ranking_block .ranking_title {
  width: 100%;
  font-size: 16px;
  font-weight: bold;
  color: #666666;
  margin: 8px 0px 24px;
}
.summary_page .summary .summary_block .ranking_block .ranking_rows {
  max-height: 250px;
  overflow-y: auto;
  display: flex;
  flex-flow: column;
}
.summary_page .summary .summary_block .ranking_block .ranking_rows .ranking_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: #666666;
  margin: 8px 0px;
  min-height: 24px;
}
.summary_page .summary .summary_block .ranking_block .ranking_rows .ranking_row .ranking_title_area {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: bold;
}
.summary_page .summary .summary_block .ranking_block .ranking_rows .ranking_row .ranking_title_area .icon_area {
  width: 40px;
  display: flex;
  justify-content: center;
  font-size: 20px;
  color: #999999;
}
.summary_page .summary .summary_block .ranking_block .ranking_rows .ranking_row .ranking_title_area .text_area {
  display: flex;
  align-items: center;
  gap: 8px;
}
.summary_page .summary .summary_block .ranking_block .ranking_rows .ranking_row .ranking_title_area .text_area .icon {
  width: 24px;
  height: 24px;
  min-width: 16px;
  min-height: 16px;
  border-radius: 50%;
}
.summary_page .summary .summary_block .ranking_block .ranking_rows .ranking_row .detail_area {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: bold;
  white-space: nowrap;
}
.summary_page .summary .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(1) .ranking_title_area {
  font-size: 18px;
}
.summary_page .summary .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(1) .ranking_title_area .icon_area {
  font-size: 30px;
  color: #cfca04;
}
.summary_page .summary .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(1) .detail_area {
  font-size: 18px;
}
.summary_page .summary .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(2) .ranking_title_area .icon_area {
  font-size: 20px;
  color: #c0c0c0;
}
.summary_page .summary .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(3) .ranking_title_area .icon_area {
  font-size: 20px;
  color: #c58204;
}
.summary_page .summary .summary_block .ranking_block .no_data {
  font-size: 24px;
  font-weight: bold;
  color: #999999;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.summary_page .summary .no_use {
  width: 50% !important;
  display: block;
  margin: auto;
}

.category_box {
  border-radius: 4px;
  text-align: center;
  border-width: 1px;
  border-style: solid;
  border-color: rgba(var(--color), var(--alpha));
}
.category_box .title {
  padding: 8px;
  font-weight: bold;
  border-radius: 3px 3px 0px 0px;
  line-height: 22px;
  background-color: rgba(var(--color), var(--alpha));
  color: rgba(var(--color), 1);
}
.category_box .title img {
  vertical-align: middle;
  margin-right: 8px;
}
.category_box .title.title_label {
  border-radius: 3px;
}
.category_box .detail {
  padding: 8px;
  font-size: 14px;
  font-weight: bold;
  border-radius: 0px 0px 3px 3px;
  background-color: #ffffff;
}

.compare_plus {
  display: table-cell;
  font-size: 16px;
  font-weight: bold;
  vertical-align: middle;
  color: #0DB765;
}
.compare_plus::before {
  content: "+";
}

.compare_minus {
  display: table-cell;
  font-size: 16px;
  font-weight: bold;
  vertical-align: middle;
  color: #DD4A38;
}

.compare_none {
  display: table-cell;
  font-size: 16px;
  font-weight: bold;
  vertical-align: middle;
  color: #cccccc;
}

.positive_negative_icon {
  margin-right: 8px;
}
.positive_negative_icon.plus svg g use {
  fill: #0DB765;
}
.positive_negative_icon.minus svg g use {
  fill: #DD4A38;
}

.comparison {
  display: flex;
}
.comparison .left_area {
  width: 40%;
}
.comparison .left_area .header_area {
  width: 100%;
  display: flex;
  align-items: center;
}
.comparison .left_area .header_area .text {
  font-size: 20px;
  font-weight: bold;
  color: #666666;
  white-space: nowrap;
}
.comparison .left_area .header_area .bar {
  width: 100%;
  height: 1px;
  background-color: #666666;
  margin: 0px 16px;
}
.comparison .left_area .header_area .switch_area {
  display: flex;
  align-items: center;
  background-color: #ECF0F5;
  color: #A8AFB4;
  padding: 4px;
  border-radius: 4px;
}
.comparison .left_area .header_area .switch_area .left {
  width: 70px;
  text-align: center;
  cursor: pointer;
  padding: 8px;
}
.comparison .left_area .header_area .switch_area .left.active {
  background-color: #4E585D;
  color: #FFFFFF;
  border-radius: 4px;
}
.comparison .left_area .header_area .switch_area .right {
  width: 70px;
  text-align: center;
  cursor: pointer;
  padding: 8px;
}
.comparison .left_area .header_area .switch_area .right.active {
  background-color: #4E585D;
  color: #FFFFFF;
  border-radius: 4px;
}
.comparison .left_area .past_graph {
  position: relative;
  width: max-content;
  height: 300px;
}
.comparison .left_area .past_graph .display_title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background-color: white;
  display: flex;
  justify-content: center;
  align-items: center;
}
.comparison .left_area .past_graph .display_tip {
  position: absolute;
  transform: translateX(-50%) translateY(-50%);
  padding: 4px 8px;
  border: 2px solid white;
  pointer-events: none;
  white-space: nowrap;
  opacity: 0;
}
.comparison .left_area .current_graph {
  position: relative;
  width: max-content;
  height: 400px;
}
.comparison .left_area .current_graph .display_title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: 200px;
  height: 200px;
  border-radius: 50%;
  background-color: white;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 20px;
  color: #666666;
  flex-flow: column;
}
.comparison .left_area .current_graph .display_tip {
  position: absolute;
  transform: translateX(-50%) translateY(-50%);
  padding: 4px 8px;
  border: 2px solid white;
  pointer-events: none;
  white-space: nowrap;
  opacity: 0;
}
.comparison .right_area {
  width: 60%;
}
.comparison .right_area .header_area {
  width: 90%;
  display: flex;
  align-items: center;
  margin-left: 10%;
  padding: 8px 0;
  margin-bottom: 16px;
}
.comparison .right_area .header_area .text {
  font-size: 20px;
  font-weight: bold;
  color: #666666;
  white-space: nowrap;
}
.comparison .right_area .header_area .bar {
  width: 100%;
  height: 1px;
  background-color: #666666;
  margin: 0px 16px;
}
.comparison .right_area .item {
  display: flex;
  align-items: center;
  margin: 4px 0px 4px 10%;
  padding: 4px 10px;
  position: relative;
}
.comparison .right_area .item .icon_warn {
  position: absolute;
  left: -20px;
  top: -10px;
  cursor: pointer;
}
.comparison .right_area .item .comment_wrap {
  position: absolute;
  width: 200px;
  border-radius: 4px;
  transform: translateX(-120%);
  background-color: #666666;
  color: white;
}
.comparison .right_area .item .comment_wrap .comment {
  position: relative;
  padding: 16px;
  line-height: 1.5em;
}
.comparison .right_area .item .comment_wrap .comment .close {
  position: absolute;
  top: 0px;
  right: 5px;
  color: white;
  cursor: pointer;
}
.comparison .right_area .item .icon {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 20px;
  opacity: 1;
}
.comparison .right_area .item .icon i {
  color: #FFFFFF;
  width: 24px;
  height: 24px;
}
.comparison .right_area .item .text_area {
  width: 150px;
}
.comparison .right_area .item .text_area .title {
  font-size: 12px;
  color: #333333;
  font-weight: 600;
}
.comparison .right_area .item .text_area .button_area {
  display: flex;
  justify-content: left;
}
.comparison .right_area .item .text_area .button_area button {
  text-align: center;
  padding: 8px 16px;
  border: 1px solid #656E73;
  border-radius: 4px;
  margin-top: 4px;
  color: #656E73;
  background-color: #FFFFFF;
  font-size: 10px;
  width: 100px;
  font-weight: 600;
  z-index: 1;
}
.comparison .right_area .item .text_area .button_area button:hover {
  background-color: #656E73;
  color: #FFFFFF;
}
.comparison .right_area .item .bar_graph_wrap {
  width: calc(100% - 250px);
  margin-right: 30px;
  opacity: 1;
}
.comparison .right_area .item .bar_graph_wrap .bar_graph_item {
  display: flex;
  align-items: center;
  padding: 2px 0px;
}
.comparison .right_area .item .bar_graph_wrap .bar_graph_item .title {
  width: 40px;
  text-align: right;
  margin-right: 10px;
}
.comparison .right_area .item .bar_graph_wrap .bar_graph_item .bar_graph_area {
  width: calc(100% - 100px);
}
.comparison .right_area .item .bar_graph_wrap .bar_graph_item .bar_graph_area .bar_graph {
  height: 24px;
  position: relative;
  background-color: #B7BECC;
  border-radius: 0 4px 4px 0;
}
.comparison .right_area .item .bar_graph_wrap .bar_graph_item .bar_graph_area .bar_graph .bar_graph_text {
  position: absolute;
  top: 50%;
  right: 0px;
  transform: translateX(130%) translateY(-50%);
  font-weight: bold;
  font-size: 16px;
  color: #B7BECC;
}
.comparison .right_area .item .bar_graph_wrap .bar_graph_item .bar_graph_area.active .bar_graph {
  background-color: #4D5A7B;
}
.comparison .right_area .item .bar_graph_wrap .bar_graph_item .bar_graph_area.active .bar_graph .bar_graph_text {
  color: #4D5A7B;
}

.label_area {
  display: flex;
  margin-top: 24px;
}
.label_area .label_item {
  display: flex;
  align-items: center;
  margin: 0px 8px;
  cursor: pointer;
  opacity: 1;
}
.label_area .label_item .label_color {
  width: 16px;
  height: 16px;
}
.label_area .label_item .label_text {
  font-size: 12px;
  margin-left: 4px;
  color: #666666;
  line-height: 1em;
}

.calendar_box {
  position: absolute;
  top: 40px;
  right: 0;
  display: block;
  background-color: #FFFFFF;
  box-shadow: 0px 3px 6px #00000029;
  border-radius: 8px;
  z-index: 2110;
  padding-bottom: 8px;
}
.calendar_box.none {
  display: none;
}
.calendar_box.in_modal {
  top: auto;
  right: auto;
}
.calendar_box button {
  outline: none;
  border: none;
  background-color: transparent;
}
.calendar_box button.year {
  border: solid 1px #CCC;
  border-radius: 4px;
  margin-bottom: 8px;
  width: 90%;
}
.calendar_box .closebox {
  position: absolute;
  top: 20px;
  right: 18px;
  font-size: 18px;
}
.calendar_box .range {
  margin: 24px 24px 0px 24px;
}
.calendar_box .range .text {
  margin-bottom: 8px;
  font-weight: bold;
}
.calendar_box .range .field {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 8px 16px;
  border: 1px solid #D5DADF;
  font-size: 12px;
}
.calendar_box .rdrMonthName {
  text-align: center;
  color: #000000;
  margin: 20px 0;
}
.calendar_box .rdrCalendarWrapper {
  border-radius: 8px;
}
.calendar_box .rdrMonth {
  padding: 0 0.833em;
}
.calendar_box .rdrDayEndOfWeek {
  width: calc(14.2857142857% - 1px);
}
.calendar_box .bottom_area {
  padding: 16px;
  background-color: #ECF0F5;
  border-top: 1px solid #D5DADF;
  border-radius: 0 0 8px 8px;
}
.calendar_box .bottom_area button {
  width: 100%;
  padding: 8px;
  border-radius: 4px;
  background-color: #4472BA;
  color: #FFFFFF;
}
.calendar_box .select_range {
  display: flex;
  justify-content: center;
  margin: 24px 0px -24px;
}
.calendar_box .toggle_switch {
  position: relative;
}
.calendar_box .toggle_switch .toggle_label {
  width: 200px;
  height: 34px;
  background: #ECF0F5;
  position: relative;
  display: inline-block;
  border-radius: 16px;
  transition: 0.4s;
  box-sizing: border-box;
}
.calendar_box .toggle_switch .toggle_label .toggle_left {
  display: flex;
  align-items: center;
  position: absolute;
  top: 5px;
  left: calc(25% - 6px);
  transform: translateX(-50%);
  z-index: 10;
  color: #497ECD;
  font-weight: normal;
  font-size: 14px;
  pointer-events: none;
}
.calendar_box .toggle_switch .toggle_label .toggle_left svg g use {
  fill: #497ECD;
}
.calendar_box .toggle_switch .toggle_label .toggle_right {
  display: flex;
  align-items: center;
  position: absolute;
  top: 5px;
  right: calc(25% + 6px);
  transform: translateX(50%);
  z-index: 10;
  color: #A8AFB4;
  font-weight: normal;
  font-size: 14px;
  pointer-events: none;
}
.calendar_box .toggle_switch .toggle_label .toggle_right svg g use {
  fill: #A8AFB4;
}
.calendar_box .toggle_switch .toggle_label:hover .toggle_right {
  color: #656E73;
}
.calendar_box .toggle_switch .toggle_label:hover .toggle_right svg g use {
  fill: #656E73;
}
.calendar_box .toggle_switch .toggle_label .toggle_input {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  opacity: 0;
  cursor: pointer;
}
.calendar_box .toggle_switch .toggle_label .toggle_input:checked ~ .toggle_left {
  color: #A8AFB4;
}
.calendar_box .toggle_switch .toggle_label .toggle_input:checked ~ .toggle_left svg g use {
  fill: #A8AFB4;
}
.calendar_box .toggle_switch .toggle_label .toggle_input:checked ~ .toggle_right {
  color: #497ECD;
}
.calendar_box .toggle_switch .toggle_label .toggle_input:checked ~ .toggle_right svg g use {
  fill: #497ECD;
}
.calendar_box .toggle_switch .toggle_label .toggle_input:checked ~ .back_ground {
  left: 112px;
  width: 110px;
}
.calendar_box .toggle_switch .toggle_label:hover .toggle_input:checked ~ .toggle_left {
  color: #656E73;
}
.calendar_box .toggle_switch .toggle_label:hover .toggle_input:checked ~ .toggle_left svg g use {
  fill: #656E73;
}
.calendar_box .toggle_switch .toggle_label::before {
  content: "";
  width: 1px;
  height: 34px;
  background-color: #FFFFFF;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.calendar_box > .daily {
  padding: 16px;
  margin-top: 16px;
  width: 350px;
}
.calendar_box > .daily .rdrDayNumber:hover {
  border: 1px solid;
  border-radius: 15px;
}
.calendar_box > .daily .select_month {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: -8px 0 16px;
  font-size: 16px;
}
.calendar_box > .daily .date_wrap {
  display: flex;
  flex-wrap: wrap;
}
.calendar_box > .daily .date_wrap .date {
  width: 14.2857142857%;
  text-align: center;
  padding: 8px 0px 4px;
  font-size: 14px;
  cursor: pointer;
}
.calendar_box > .daily .date_wrap .date .bar {
  width: 60%;
  height: 2px;
  margin: 2px auto;
  background-color: #FFFFFF;
}
.calendar_box > .daily .date_wrap .date:hover {
  background-color: #f0f8ff;
}
.calendar_box > .daily .date_wrap .date:hover .bar {
  background-color: #f0f8ff;
}
.calendar_box > .daily .date_wrap .date.in_range {
  background-color: #4372BA;
  color: #FFFFFF !important;
}
.calendar_box > .daily .date_wrap .date.in_range .bar {
  background-color: #4372BA;
}
.calendar_box > .daily .date_wrap .date.today .bar {
  background-color: #4372BA;
}
.calendar_box > .daily .date_wrap .date.selected {
  background-color: #4372BA;
  color: #FFFFFF !important;
}
.calendar_box > .daily .date_wrap .date.selected .bar {
  background-color: #4372BA;
}
.calendar_box > .daily .date_wrap .date.selected.today .bar {
  background-color: #FFFFFF;
}
.calendar_box > .daily .date_wrap .date.disable {
  opacity: 0.3;
  cursor: not-allowed;
}
.calendar_box > .daily .date_wrap .date.disable:hover {
  border-bottom: none;
}
.calendar_box > .weekly {
  margin: 0 16px;
}
.calendar_box > .weekly .rdrSelected {
  color: transparent !important;
}
.calendar_box > .weekly .rdrSelected + span + .rdrDayNumber span,
.calendar_box > .weekly .rdrSelected + .rdrDayNumber span {
  color: #1d2429;
}
.calendar_box > .weekly .rdrDayStartPreview,
.calendar_box > .weekly .rdrDayEndPreview {
  border: none;
}
.calendar_box > .weekly .rdrCalendarWrapper:not(.rdrDateRangeWrapper) .rdrDayHovered .rdrDayNumber:after {
  content: none;
}
.calendar_box > .weekly .rdrDayNumber:hover {
  border: 1px solid;
  border-radius: 15px;
}
.calendar_box > .weekly .rdrSelected {
  left: 0;
  right: 0;
}
.calendar_box > .monthly, .calendar_box > .weekly {
  padding: 16px;
  margin-top: 16px;
  width: 350px;
}
.calendar_box > .monthly .select_month, .calendar_box > .weekly .select_month {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: -8px 0 16px;
  font-size: 16px;
}
.calendar_box > .monthly .select_month button, .calendar_box > .weekly .select_month button {
  border: none;
}
.calendar_box > .monthly .select_month button:hover, .calendar_box > .weekly .select_month button:hover {
  color: #4472BA;
}
.calendar_box > .monthly .select_month button:disabled, .calendar_box > .weekly .select_month button:disabled {
  color: #999999;
  cursor: not-allowed;
}
.calendar_box > .monthly .select_month button:disabled:hover, .calendar_box > .weekly .select_month button:disabled:hover {
  color: #999999;
}
.calendar_box > .monthly .monthly_button, .calendar_box > .weekly .monthly_button {
  width: 25%;
  display: inline-block;
  text-align: center;
  padding: 4px;
}
.calendar_box > .monthly .monthly_button button, .calendar_box > .weekly .monthly_button button {
  border: none;
  padding: 8px 16px;
  border-radius: 4px;
  width: 100%;
}
.calendar_box > .monthly .monthly_button button:hover, .calendar_box > .weekly .monthly_button button:hover {
  background-color: #ECF0F5;
  color: #4472BA;
}
.calendar_box > .monthly .monthly_button button:disabled, .calendar_box > .weekly .monthly_button button:disabled {
  color: #999999;
  cursor: not-allowed;
}
.calendar_box > .monthly .monthly_button button:disabled:hover, .calendar_box > .weekly .monthly_button button:disabled:hover {
  background-color: transparent;
  color: #999999;
}
.calendar_box > .monthly .monthly_button button.selected, .calendar_box > .weekly .monthly_button button.selected {
  background-color: #4472BA;
  color: #FFFFFF;
}
.calendar_box > .custom {
  margin: 0 16px;
}
.calendar_box > .custom .rdrMonthAndYearWrapper {
  position: relative;
  height: 0;
  padding: 0;
}
.calendar_box > .custom .rdrMonthAndYearPickers {
  display: none;
}
.calendar_box > .custom .rdrPprevButton {
  position: absolute;
  top: 28px;
  left: 11px;
}
.calendar_box > .custom .rdrNextButton {
  position: absolute;
  top: 28px;
  right: 11px;
}

.calendar_text {
  display: flex;
  align-items: center;
  position: relative;
  justify-content: space-between;
}
.calendar_text .button {
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  background-color: #FFFFFF;
  color: initial;
  min-width: auto;
}
.calendar_text .button.display {
  margin-right: 8px;
  padding: 8px 24px;
  font-size: 16px;
  display: flex;
  align-items: center;
}
.calendar_text .button.display .icon,
.calendar_text .button.display .in_modal {
  margin-left: 16px;
  transition: transform 0.3s ease;
}
.calendar_text .button.display .icon.open,
.calendar_text .button.display .in_modal.open {
  transform: rotate(180deg);
}
.calendar_text .button.prev {
  font-size: 16px;
  margin-right: 8px;
  border: solid 1px #CCC;
  border-radius: 4px;
  background-color: #FFF;
}
.calendar_text .button.next {
  font-size: 16px;
  border: solid 1px #CCC;
  border-radius: 4px;
  background-color: #FFF;
}
.calendar_text .button:disabled {
  color: #999999;
  cursor: not-allowed;
  background-color: #efefef;
}
.calendar_text .button:hover {
  background-color: inherit;
}

.calendar_range {
  display: flex;
  background-color: #c8d5e8;
  padding: 4px 2px;
  border-radius: 6px;
  z-index: 1009;
}
.calendar_range button {
  padding: 8px 24px;
  margin: 0 4px;
  border-radius: 6px;
  border: none;
  background: transparent;
}
.calendar_range button.selected {
  background-color: #4572BA;
  color: #FFFFFF;
}
.calendar_range .calender_switch {
  width: 100%;
  position: absolute;
  height: 36px;
  top: 0;
  left: 0;
  display: none;
}
.calendar_range .calender_switch.display {
  display: block;
}

.calendar_button_area {
  border-top: 1px solid #CCCCCC;
  padding: 24px 24px 16px;
  margin-top: 8px;
  display: flex;
  justify-content: flex-end;
}
.calendar_button_area button {
  border-radius: 4px;
  padding: 8px 16px;
}
.calendar_button_area button.submit_button {
  background-color: #4572BA;
  color: #FFFFFF;
}
.calendar_button_area button.submit_button:hover {
  background-color: #094E8D;
}
.calendar_button_area button.cancel_button {
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  margin-right: 8px;
}
.calendar_button_area button.cancel_button:hover {
  background-color: #656E73;
  color: #FFFFFF;
}

.calendar_quick {
  border-top: 1px solid #CCCCCC;
  padding: 24px 24px 16px;
  margin-top: 8px;
}
.calendar_quick .text {
  margin-bottom: 16px;
  font-weight: bold;
}
.calendar_quick .field .button {
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  padding: 8px 16px;
  margin: 0 4px;
}
.calendar_quick .field .button:hover {
  background-color: #ECF0F5;
}

.screen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 1030;
  background-color: #000000;
  opacity: 0.3;
}
.screen.modal_on_modal {
  z-index: 1130;
}
.screen.transparent {
  background-color: transparent;
}
.screen.none {
  z-index: -1;
}
.screen.in_modal {
  width: 100%;
  height: 100%;
}

.dnd_box {
  position: absolute;
  top: 40px;
  right: 0;
  display: block;
  background-color: #FFFFFF;
  box-shadow: 0px 3px 6px #00000029;
  border-radius: 8px;
  z-index: 2110;
  padding-bottom: 8px;
  width: 350px;
}
.dnd_box.none {
  display: none;
}
.dnd_box .title {
  margin: 24px 24px 0px;
  font-weight: bold;
}
.dnd_box > .item_list {
  padding: 16px;
}
.dnd_box > .item_list .item {
  border: solid 1px #CCC;
  padding: 16px 8px;
  margin: 4px;
  background-color: #FFFFFF;
  display: flex;
  justify-content: space-between;
  border-radius: 8px;
}

.no_image {
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: #FFFFFF;
  padding: 40px;
  box-sizing: border-box;
  color: #BABABA;
  text-align: left;
  transform: translateX(-50%) translateY(-50%);
}
.no_image .title {
  font-size: 20px;
  margin-bottom: 8px;
}
.no_image .message {
  font-size: 16px;
}

#plan-table-modal-title {
  text-align: center;
  color: #4a7ecd;
  font-weight: 700;
  margin-top: 1em;
}

button.btn-primary {
  text-align: center;
  color: #FFFFFF;
  border: 1px solid #4472BA;
  border-radius: 4px;
  background-color: #4472BA;
  margin-top: 8px;
  padding: 8px 16px;
}
button.btn-primary:hover {
  color: #FFFFFF;
  background-color: #094E8D;
}

.mail_sample.modal_box .modal_body {
  max-height: none;
}
.mail_sample.modal_box .modal_body img {
  width: 100%;
}

.sample_mail_link {
  margin: 0 4px;
  text-decoration: underline dashed;
  cursor: pointer;
}

.password_reset .input-area {
  margin-bottom: 16px;
}
.password_reset input[type=text] {
  border: solid 1px #CCC;
  border-radius: 4px;
  background-color: #FFFFFF;
  width: 100%;
  padding: 8px;
  margin-bottom: 16px;
}
.password_reset input[type=password] {
  border: solid 1px #CCC;
  border-radius: 4px;
  background-color: #FFFFFF;
  width: 100%;
  padding: 8px;
  margin-bottom: 16px;
}
.password_reset input[type=password].error {
  background-color: #FFFFFF;
  border: 2px solid #e18888;
  padding: 9px;
}
.password_reset input[type=password].error:focus {
  outline: none;
}
.password_reset .password_error {
  color: #C61616;
  line-height: 1.6em;
}
.password_reset .loading {
  display: inline-block;
  width: 24px;
  height: 24px;
  border: 3px solid #FFFFFF;
  border-image: initial;
  border-radius: 50%;
  border-right-color: transparent;
  animation: rotation-frame 0.75s linear infinite;
}

.wg-default,
.wg-default .country-selector {
  bottom: unset !important;
  top: 5px !important;
  right: 50px !important;
  z-index: 2002 !important;
}

.wg-drop.country-selector .wgcurrent {
  border-radius: 4px;
}

.modal_open .wg-drop.country-selector {
  background-color: transparent;
  pointer-events: none;
}
.modal_open .wg-drop.country-selector .wgcurrent {
  border-color: #9D9D9D;
}
.modal_open .wg-drop.country-selector a:hover {
  color: inherit;
  cursor: default;
}

.work_style_header {
  margin-bottom: 32px;
}
.work_style_header .title {
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  padding: 8px;
  border-bottom: 1px solid #707070;
  color: #333333;
  margin: 0px auto 8px;
  width: fit-content;
}
.work_style_header .description {
  width: 76%;
  margin: 0px auto;
  font-size: 14px;
  color: #777777;
}
.work_style_header .description p {
  margin: 0;
}
.work_style_header.force {
  background-color: #DAE3F1;
  margin: -32px -32px 32px;
  padding: 16px 0px 16px;
}
.work_style_header.force .title {
  color: #4372BA;
  border-bottom: 1px solid #4372BA;
}
.work_style_header.force .description {
  width: 80%;
  color: #4372BA;
}

.work_style_body {
  display: flex;
  justify-content: center;
}
.work_style_body .left_area {
  width: 33%;
  margin-right: 1%;
}
.work_style_body .right_area {
  width: 60%;
  margin-left: 6%;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 24px 24px 16px 24px;
  margin-top: 8px;
  position: relative;
}
.work_style_body .title {
  font-size: 18px;
  font-weight: bold;
  color: #666666;
  margin-bottom: 16px;
}
.work_style_body .detail_area {
  margin-bottom: 16px;
}
.work_style_body .detail_area .title {
  font-size: 14px;
  margin-bottom: 8px;
}
.work_style_body .detail_area .field {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.work_style_body .detail_area .field select {
  width: 100%;
  padding: 8px 16px;
  font-size: 14px;
  border: 1px solid #999999;
  background-color: #ffffff;
  border-radius: 3px;
  position: relative;
}
.work_style_body .detail_area .field.change_icon select {
  width: 100%;
}
.work_style_body .detail_area .field.change_icon .arrow {
  font-size: 24px;
  font-weight: bold;
  color: #777777;
}
.work_style_body .detail_area .field.change_icon .icon {
  width: 40px;
  height: 40px;
}
.work_style_body .detail_area .field.change_icon .icon.gray {
  background-color: #CCCCCC;
}
.work_style_body .detail_area .field .dummy_input {
  width: 100%;
  display: flex;
  border: 1px solid #999999;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  background-color: #eeeeee;
}
.work_style_body .detail_area .field .dummy_input div:nth-child(2) {
  margin-left: 8px;
}
.work_style_body .detail_area .error {
  color: #FF0000;
}
.work_style_body button.submit_button {
  border: 1px solid #4372ba;
  border-radius: 4px;
  background-color: #4372ba;
  color: #ffffff;
  font-size: 14px;
  width: 100%;
  text-align: center;
  height: auto;
}
.work_style_body button.submit_button:disabled {
  background-color: #CCC;
  border: solid 1px #CCC;
}
.work_style_body .title_label {
  position: absolute;
  top: 0px;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #ffffff;
  font-size: 16px;
  color: #777777;
  padding: 0px 16px;
}
.work_style_body .big_arrow {
  position: absolute;
  display: flex;
  align-items: center;
  top: 50%;
  left: -40px;
  transform: translateY(-50%);
}
.work_style_body .big_arrow div:nth-child(1) {
  background-color: #cccccc;
  width: 20px;
  height: 50px;
}
.work_style_body .big_arrow div:nth-child(2) {
  width: 60px;
  height: 60px;
  background: linear-gradient(to right bottom, transparent 0px, transparent 50%, #cccccc 50%, #cccccc 100%);
  transform: rotate(-45deg);
  margin-left: -30px;
}
.work_style_body .image_example {
  margin-bottom: 32px;
}
.work_style_body .image_example img {
  width: calc(100% - 32px);
  height: auto;
  margin: 0px 16px;
}
.work_style_body .legend_area {
  display: flex;
}
.work_style_body .legend_area .legend_left_area {
  width: 29%;
  margin-right: 1%;
}
.work_style_body .legend_area .legend_right_area {
  width: 69%;
  margin-left: 1%;
}
.work_style_body .legend_area .title_area {
  text-align: center;
  margin-bottom: 8px;
  position: relative;
  height: 20px;
}
.work_style_body .legend_area .title_area hr {
  position: absolute;
  top: 50%;
  width: 100%;
  color: #cccccc;
}
.work_style_body .legend_area .title_area .title {
  background-color: #ffffff;
  position: absolute;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  padding: 0px 8px 0px 0px;
}
.work_style_body .legend_area .legend_wrap {
  display: flex;
  flex-flow: wrap;
}
.work_style_body .legend_area .legend {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
  margin-right: 8px;
}
.work_style_body .legend_area .legend .icon {
  width: 18px;
  height: 18px;
  margin-right: 8px;
}

.work_style_confirm_body {
  text-align: center;
}
.work_style_confirm_body .example_image {
  width: 60%;
}
.work_style_confirm_body .item_list {
  position: relative;
  display: flex;
  justify-content: space-evenly;
  border: solid 1px #CCC;
  border-radius: 4px;
  padding: 24px;
  margin: 32px auto;
}
.work_style_confirm_body .item_list .item_list_title {
  position: absolute;
  top: 0;
  transform: translateY(-50%);
  background-color: #FFFF;
  font-size: 16px;
  padding: 8px;
}
.work_style_confirm_body .item_list .item {
  margin: 0px 8px;
  text-align: center;
  min-width: 60px;
}
.work_style_confirm_body .item_list .item img {
  width: 40px;
  height: 40px;
  margin: auto;
}
.work_style_confirm_body .item_list .item .text_area {
  width: 40px;
  height: 40px;
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
  font-size: 16px;
}
.work_style_confirm_body .item_list .item .item_title {
  margin-top: 4px;
  font-size: 12px;
}
.work_style_confirm_body .item_list .item .item_title div {
  width: 80px;
  font-size: 10px;
  color: #FFFFFF;
  background-color: #777777;
  padding: 4px 0;
  margin: 0 auto 4px;
}

.work_style_tip {
  width: 100%;
  text-align: center;
  padding: 8px;
  border: 1px solid #cccccc;
  background-color: #ecf0f4;
  outline: #ffffff solid 4px;
  outline-offset: -5px;
}
.work_style_tip .title {
  font-weight: bold;
  margin: 8px 0px;
}
.work_style_tip .work_style_area {
  padding-bottom: 8px;
  border-bottom: 1px solid #cccccc;
  margin-bottom: 8px;
}
.work_style_tip .work_style_area .icon {
  width: 40px;
  height: 40px;
  margin: auto;
}
.work_style_tip .work_style_area .icon.gray {
  background-color: #CCC;
}
.work_style_tip .work_style_area .description {
  font-size: 10px;
  margin-top: 8px;
}
.work_style_tip .dummy_input {
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 4px;
  background-color: #ffffff;
}
.work_style_tip .button_area {
  margin-top: 16px;
  margin-bottom: 8px;
}
.work_style_tip .button_area button {
  border: 1px solid #4372ba;
  border-radius: 4px;
  background-color: #4372ba;
  color: #ffffff;
  width: 100%;
  text-align: center;
  padding: 4px;
}

.profile_wrapper {
  display: flex;
}
.profile_wrapper .fixed_work_style_tip {
  width: 200px;
  position: fixed;
  right: 0px;
  top: 100px;
  z-index: 1;
}
.profile_wrapper .left_area {
  width: 19%;
  margin-right: 1%;
  display: flex;
  align-items: start;
}
.profile_wrapper .left_area .profile_image_wrapper {
  width: 100%;
  text-align: center;
  position: relative;
}
.profile_wrapper .left_area .profile_image_wrapper .hidden {
  display: none;
}
.profile_wrapper .left_area .profile_image_wrapper .plus_icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #4372ba;
  border: 3px solid #ffffff;
  color: #ffffff;
  position: absolute;
  bottom: 0px;
  right: 0px;
  font-size: 25px;
  font-weight: bold;
  cursor: pointer;
}
.profile_wrapper .right_area {
  width: calc(79% - 140px);
  margin-left: 1%;
}
.profile_wrapper .right_area fieldset {
  border: solid 1px #999999;
  border-radius: 4px;
  padding: 24px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}
.profile_wrapper .right_area fieldset legend {
  font-size: 14px;
  font-weight: bold;
  padding: 0 8px;
  color: #666666;
}
.profile_wrapper .right_area fieldset .item {
  width: 100%;
  margin-bottom: 16px;
}
.profile_wrapper .right_area fieldset .item:last-of-type {
  margin-bottom: 0;
}
.profile_wrapper .right_area fieldset .item .title {
  margin-bottom: 8px;
  font-weight: bold;
}
.profile_wrapper .right_area fieldset .item .detail {
  min-height: 34px;
}
.profile_wrapper .right_area fieldset .item .detail input[type=text],
.profile_wrapper .right_area fieldset .item .detail input[type=number],
.profile_wrapper .right_area fieldset .item .detail select {
  height: 34px;
  padding: 8px 16px;
  background-color: #FFFFFF;
  border: solid 1px #CCCCCC;
  border-radius: 4px;
}
.profile_wrapper .right_area fieldset .item .detail input[type=text]:focus,
.profile_wrapper .right_area fieldset .item .detail input[type=number]:focus,
.profile_wrapper .right_area fieldset .item .detail select:focus {
  outline: none;
}
.profile_wrapper .right_area fieldset .item .detail input[type=checkbox],
.profile_wrapper .right_area fieldset .item .detail input[type=radio] {
  margin-right: 4px;
}
.profile_wrapper .right_area fieldset .item .detail label {
  margin-bottom: 0;
}
.profile_wrapper .right_area fieldset .item .detail label + label {
  margin-left: 8px;
}
.profile_wrapper .right_area fieldset .item .detail + .detail {
  margin-top: 12px;
}
.profile_wrapper .right_area fieldset .item .detail .icon {
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.profile_wrapper .right_area fieldset .item .detail.equal_space {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.profile_wrapper .right_area fieldset .item .detail.row_1 input[type=text],
.profile_wrapper .right_area fieldset .item .detail.row_1 input[type=number],
.profile_wrapper .right_area fieldset .item .detail.row_1 select {
  width: 100%;
}
.profile_wrapper .right_area fieldset .item .detail.row_1.code {
  display: flex;
}
.profile_wrapper .right_area fieldset .item .detail.row_1.code label {
  align-items: center;
  display: flex;
}
.profile_wrapper .right_area fieldset .item .detail.row_1.code label input[type=radio] {
  margin-right: 4px;
  margin-top: 0;
}
.profile_wrapper .right_area fieldset .item .detail.preset {
  display: flex;
  justify-content: space-around;
}
.profile_wrapper .right_area fieldset .item .detail.preset button {
  display: inline-block;
  text-align: center;
  width: 24%;
  padding: 8px 12px;
  border-radius: 4px;
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  color: #656E73;
}
.profile_wrapper .right_area fieldset .item .detail .sample_picture {
  margin: 10px 0px;
  border: 2px dotted #EEEEEE;
  color: #AAAAAA;
  padding: 10px;
}
.profile_wrapper .right_area fieldset .item .detail .dummy_input {
  width: 100%;
  display: flex;
  border-radius: 4px;
  padding: 8px 16px;
  background-color: #eeeeee;
  color: #777777;
  cursor: not-allowed;
}
.profile_wrapper .right_area fieldset .item .detail .dummy_input div:nth-child(2) {
  margin-left: 8px;
}
.profile_wrapper .right_area fieldset .item .error {
  margin-top: 4px;
  color: #C61616;
}
.profile_wrapper .right_area .profile_input {
  margin: 24px 0;
}
.profile_wrapper .right_area .profile_input.flex {
  display: flex;
}
.profile_wrapper .right_area .profile_input.flex .input_left_area {
  width: 48%;
  margin-right: 2%;
}
.profile_wrapper .right_area .profile_input.flex .input_right_area {
  width: 48%;
  margin-left: 2%;
}
.profile_wrapper .right_area .profile_input .title {
  font-size: 14px;
  margin-bottom: 8px;
}
.profile_wrapper .right_area .profile_input input[type=text] {
  width: 100%;
  padding: 16px;
  font-size: 14px;
}
.profile_wrapper .right_area .profile_input .error {
  margin: 8px 0;
  color: #FF0000;
}
.profile_wrapper .right_area .button_area {
  text-align: center;
  margin-top: 40px;
}
.profile_wrapper .right_area .button_area button {
  border: 1px solid #4372ba;
  border-radius: 4px;
  background-color: #4372ba;
  color: #ffffff;
  font-size: 14px;
  width: 100%;
  text-align: center;
  padding: 12px;
}

.team_wrap {
  display: flex;
  justify-content: space-evenly;
  text-align: center;
  position: relative;
}
.team_wrap .team_block .team_row {
  position: relative;
  margin: 0 8px;
}
.team_wrap .team_block .team_row .team {
  border: 1px solid #cccccc;
  border-radius: 4px;
  width: 50px;
  min-height: 16px;
  margin: 10px auto;
  padding: 4px;
  position: relative;
  color: transparent;
  background-color: #CCCCCC;
  cursor: pointer;
  display: flex;
  justify-content: center;
  flex-flow: column;
}
.team_wrap .team_block .team_row .team .icon {
  display: none;
}
.team_wrap .team_block .team_row .team .icon.open {
  transform: rotate(180deg);
}
.team_wrap .team_block .team_row .team .bar_bottom {
  height: 11px;
  width: 1px;
  background-color: #cccccc;
  position: absolute;
  bottom: 0px;
  left: 50%;
  transform: translateX(-50%) translateY(100%);
}
.team_wrap .team_block .team_row .team .bar_top {
  height: 12px;
  width: 1px;
  background-color: #CCCCCC;
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
}
.team_wrap .team_block .team_row .bar_horizontal {
  height: 1px;
  width: 100%;
  background-color: #cccccc;
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
}
.team_wrap .team_block .team_row .bar_hidden_left {
  height: 2px;
  width: calc(50% + 8px);
  background-color: #ffffff;
  position: absolute;
  top: -12px;
  left: calc(50% - 1px);
  transform: translateX(-100%);
  z-index: 1;
}
.team_wrap .team_block .team_row .bar_hidden_right {
  height: 2px;
  width: calc(50% + 8px);
  background-color: #ffffff;
  position: absolute;
  top: -12px;
  right: calc(50% - 1px);
  transform: translateX(100%);
  z-index: 1;
}
.team_wrap.open .team_block .team_row .team {
  width: 150px;
  margin: 10px auto;
  padding: 8px;
  background-color: #666666;
  color: #ffffff;
}
.team_wrap.open .team_block .team_row .team .icon {
  display: block;
}
.team_wrap.open .team_block .team_row .team.open {
  background-color: #ffffff;
  color: #666666;
}
.team_wrap.open .team_block .team_row.open {
  background-color: #ffffff;
  color: #666666;
}
.team_wrap.parent {
  width: fit-content;
  margin: auto;
}
.team_wrap.parent > .team_block {
  position: relative;
  min-width: 264px;
}
.team_wrap.parent > .team_block > .team_row > .team {
  width: 170px;
  margin: 10px auto;
  padding: 16px;
  background-color: #666666;
  color: #ffffff;
}
.team_wrap.parent > .team_block > .team_row > .team .icon {
  display: block;
}
.team_wrap.parent > .team_block > .team_row > .team.open {
  background-color: #ffffff;
  color: #666666;
}
.team_wrap.parent > .team_block > .team_row > .team.open + .bar_horizontal {
  bottom: -130px;
  width: 100vw;
}
.team_wrap.parent > .team_block > .team_row > .team.open > .bar_bottom {
  height: 130px;
}
.team_wrap.parent > .team_block > .team_wrap.open {
  top: 120px;
  left: 50%;
  transform: translateX(-50%);
}
.team_wrap.parent > .team_block > .team_wrap.open > .team_block > .team_row > .bar_hidden_left,
.team_wrap.parent > .team_block > .team_wrap.open > .team_block > .team_row > .bar_hidden_right {
  width: 50vw;
}

.modal_box.work_style_modal {
  margin-top: auto;
}
.modal_box.work_style_modal .modal_body {
  background-color: #FFFFFF;
  max-height: 660px;
  border-radius: 0;
}

.analyze_page .tips {
  position: relative;
}
.analyze_page .tip_wrap {
  position: absolute;
  left: 50%;
  top: -10px;
  transform: translateY(-120%) translateX(-50%);
  background-color: #FFFFFF;
  color: #666666;
  padding: 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: initial;
  border: solid 1px #666666;
}
.analyze_page .tip_wrap .tip {
  position: relative;
  white-space: nowrap;
}
.analyze_page .tip_wrap .tip::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #FFFFFF;
  position: absolute;
  bottom: -17px;
  left: 50%;
  margin: auto;
  transform: rotate(45deg) translateX(-50%);
  z-index: 0;
  border-bottom: solid 1px #666666;
  border-right: solid 1px #666666;
}
.analyze_page .tips:hover .tip_wrap {
  display: block;
}
.analyze_page h1.flex {
  display: flex;
}
.analyze_page h1 button.favorite {
  font-size: 20px;
  padding: 0px;
  margin-left: 8px;
  color: #666666;
  transform: rotate(45deg);
}
.analyze_page h1 button.favorite.on {
  color: #ef2f36;
}
.analyze_page .no_data_area {
  text-align: center;
  color: #999999;
  margin-top: 80px;
}
.analyze_page .no_data_area .no_data_title {
  font-size: 40px;
  font-weight: bold;
  margin-bottom: 40px;
}
.analyze_page .no_data_area .no_data_text {
  font-size: 16px;
}
.analyze_page .block-detail .index_link_area {
  text-align: right;
  margin-top: 16px;
}
.analyze_page .search_button {
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 10px 16px;
  background-color: #ffffff;
  margin-right: 8px;
  font-size: 12px;
}
.analyze_page .search_box {
  right: 0;
  padding: 16px;
  position: absolute;
  top: 40px;
  display: block;
  background-color: #FFFFFF;
  box-shadow: 0px 3px 6px #00000029;
  border-radius: 8px;
  z-index: 2110;
}
.analyze_page .search_box.none {
  display: none;
}
.analyze_page .search_box .search_detail {
  width: 600px;
  max-height: 300px;
  overflow: auto;
  scrollbar-width: none;
}
.analyze_page .search_box .search_detail::-webkit-scrollbar {
  display: none;
}
.analyze_page .search_box .search_detail .category {
  margin-bottom: 16px;
}
.analyze_page .search_box .search_detail .category .category_title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  padding: 8px 4px;
  border-bottom: 1px solid #cccccc;
  margin-bottom: 8px;
}
.analyze_page .search_box .search_detail .category .category_title .select_reset {
  font-size: 10px;
  cursor: pointer;
  color: #4572BA;
}
.analyze_page .search_box .search_detail .category .search_area {
  position: relative;
  width: 100%;
  margin-bottom: 8px;
  background-color: #FFFFFF;
  border: solid 1px #CCCCCC;
  padding: 0 8px;
  border-radius: 4px;
  font-size: 12px;
  display: flex;
  align-items: center;
}
.analyze_page .search_box .search_detail .category .search_area .icon {
  margin-right: 8px;
}
.analyze_page .search_box .search_detail .category .search_area input[type=text] {
  width: 100%;
  font-size: 12px;
  border: none;
  background-color: transparent;
}
.analyze_page .search_box .search_detail .category .search_area .reset {
  padding: 4px;
}
.analyze_page .search_box .search_detail .category button.chip {
  background: #FFFFFF;
  border: solid 1px #CCCCCC;
  padding: 8px 10px;
  color: #333333;
  border-radius: 14px;
  display: inline-block;
  margin: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.analyze_page .search_box .search_detail .category button.chip.checked {
  color: #00a012;
  background-color: #e0f4e2;
}
.analyze_page .search_box .search_detail .category label {
  display: flex;
  align-items: center;
  margin: 8px 4px;
}
.analyze_page .search_box .search_detail .category label input[type=checkbox] {
  margin-right: 4px;
}
.analyze_page .search_condition {
  margin-bottom: 40px;
  position: relative;
  background-color: #ffffff;
  color: #666666;
  padding: 16px;
  box-shadow: #cccccc 0px 0px 4px;
}
.analyze_page .sticky_header .sticky_header_title {
  padding: 0px 4px;
  margin-bottom: 16px;
  font-size: 20px;
}
.analyze_page .search_condition_title {
  padding: 0px 4px;
  margin-bottom: 8px;
  font-size: 16px;
}
.analyze_page .chip_wrap {
  display: flex;
  align-items: center;
  white-space: nowrap;
  flex-wrap: wrap;
}
.analyze_page .chip_wrap .chip_area {
  margin: 4px;
  display: flex;
  align-items: center;
}
.analyze_page .chip_wrap .chip_area .chip {
  background-color: #dddddd;
  border-radius: 20px;
  padding: 4px 8px;
}
.analyze_page .chip_wrap .chip_area .chip_list {
  display: flex;
  align-items: center;
  white-space: nowrap;
  flex-wrap: wrap;
}
.analyze_page .chip_wrap .chip_area .chip_list .chip {
  margin: 4px;
}
.analyze_page .application_card_frame {
  display: flex;
  align-items: start;
  flex-flow: wrap;
}
.analyze_page .application_card_frame .application_card_wrap {
  position: relative;
  width: 24%;
  margin: 0.5%;
}
.analyze_page .application_card_frame .application_card_wrap .application_card {
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  position: relative;
}
.analyze_page .application_card_frame .application_card_wrap .application_card .icon_area {
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.analyze_page .application_card_frame .application_card_wrap .application_card .icon_area svg {
  width: 50px;
  height: 50px;
}
.analyze_page .application_card_frame .application_card_wrap .application_card .detail_area {
  width: calc(90% - 60px);
  margin-right: 10px;
}
.analyze_page .application_card_frame .application_card_wrap .application_card .detail_area .category_title {
  font-size: 10px;
  margin-bottom: 4px;
  padding: 4px 8px;
  border-radius: 6px;
}
.analyze_page .application_card_frame .application_card_wrap .application_card .detail_area .category_title span {
  filter: invert(100%) grayscale(100%) contrast(100);
  font-weight: bold;
}
.analyze_page .application_card_frame .application_card_wrap .application_card .detail_area .application_title {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 8px;
  height: 2.3em;
  overflow: hidden;
}
.analyze_page .application_card_frame .application_card_wrap .application_card .detail_area .detail_row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.analyze_page .application_card_frame .application_card_wrap .application_card .detail_area .detail_row .value {
  display: flex;
  align-items: baseline;
}
.analyze_page .application_card_frame .application_card_wrap .application_card .detail_area .detail_row .value span {
  font-size: 20px;
  font-weight: bold;
  margin-right: 2px;
}
.analyze_page .application_card_frame .application_card_wrap .application_card:hover {
  opacity: 0.5;
}
.analyze_page .application_card_frame .application_card_wrap button.favorite {
  position: absolute;
  top: 5px;
  left: 10px;
  font-size: 20px;
  padding: 0px;
  color: #666666;
  transform: rotate(-45deg);
}
.analyze_page .application_card_frame .application_card_wrap button.favorite.on {
  color: #ef2f36;
}
.analyze_page .report_card_frame {
  display: flex;
  align-items: start;
  flex-flow: wrap;
}
.analyze_page .report_card_frame .report_card {
  width: 49%;
  margin: 0.5%;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  position: relative;
}
.analyze_page .report_card_frame .report_card .image_area {
  width: 100px;
  height: 100px;
}
.analyze_page .report_card_frame .report_card .image_area img {
  width: 100%;
}
.analyze_page .report_card_frame .report_card .detail_area {
  width: calc(95% - 100px);
  height: 100px;
}
.analyze_page .report_card_frame .report_card .detail_area .title {
  font-size: 16px;
  margin: 8px 0px;
}
.analyze_page .report_card_frame .report_card:hover {
  opacity: 0.5;
}
.analyze_page .grid_area {
  display: flex;
  flex-flow: wrap;
}
.analyze_page .grid_area .grid_block {
  width: 100%;
  margin: 1%;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
}
.analyze_page .grid_area .grid_block .title {
  font-size: 18px;
  font-weight: bold;
  color: #666666;
  padding: 8px;
}
.analyze_page .grid_area .grid_block .title.center {
  text-align: center;
}
.analyze_page .grid_area .grid_block .value {
  text-align: center;
  font-size: 20px;
  color: #666666;
}
.analyze_page .grid_area .grid_block .value strong {
  text-align: center;
  font-size: 100px;
  font-weight: bold;
  color: #4471b9;
}
.analyze_page .grid_area .grid_block .value.ratio {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 60px;
}
.analyze_page .grid_area .grid_block.block_8 {
  width: 64.6666666667%;
}
.analyze_page .grid_area .grid_block.block_6 {
  width: 48%;
}
.analyze_page .grid_area .grid_block.block_4 {
  width: 31.3333333333%;
}
.analyze_page .grid_area .grid_block.block_3 {
  width: 23%;
}
.analyze_page .grid_area .grid_block.block_2 {
  width: 14.6666666667%;
}
.analyze_page .grid_area .grid_block.no_border {
  border: none;
}
.analyze_page .grid_area .grid_block.grid_title {
  margin: 0;
  border: none;
  font-size: 18px;
  font-weight: bold;
  color: #666666;
}
.analyze_page .grid_area .grid_block.reverse {
  background-color: #4471b9;
  border: none;
}
.analyze_page .grid_area .grid_block.reverse .title {
  color: #FFFFFF;
}
.analyze_page .grid_area .grid_block.reverse .value {
  color: #FFFFFF;
}
.analyze_page .grid_area .grid_block.reverse .value strong {
  color: #FFFFFF;
}
.analyze_page .pie_chart_wrap .chart {
  border: 1px solid #EEEEEE;
  border-radius: 50%;
  margin: auto;
}
.analyze_page .pie_chart_wrap .label_area {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 16px 0px 8px;
}
.analyze_page .pie_chart_wrap .label_area .label {
  display: flex;
  align-items: center;
  margin: 0px 4px;
}
.analyze_page .pie_chart_wrap .label_area .label .label_color {
  width: 12px;
  height: 12px;
  margin-right: 4px;
}
.analyze_page .pie_chart_wrap .label_area .label .label_title {
  color: #666666;
}
.analyze_page .line_chart_wrap .horizontal .line_chart_area,
.analyze_page .line_chart_wrap .horizontal .bar_chart_area,
.analyze_page .bar_chart_wrap .horizontal .line_chart_area,
.analyze_page .bar_chart_wrap .horizontal .bar_chart_area {
  width: 100%;
  padding: 16px;
}
.analyze_page .line_chart_wrap .horizontal .line_chart_area .row,
.analyze_page .line_chart_wrap .horizontal .bar_chart_area .row,
.analyze_page .bar_chart_wrap .horizontal .line_chart_area .row,
.analyze_page .bar_chart_wrap .horizontal .bar_chart_area .row {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  padding: 8px 0px;
}
.analyze_page .line_chart_wrap .horizontal .line_chart_area .row .row_title,
.analyze_page .line_chart_wrap .horizontal .bar_chart_area .row .row_title,
.analyze_page .bar_chart_wrap .horizontal .line_chart_area .row .row_title,
.analyze_page .bar_chart_wrap .horizontal .bar_chart_area .row .row_title {
  width: 15%;
  padding: 0px 8px;
}
.analyze_page .line_chart_wrap .horizontal .line_chart_area .row .row_value,
.analyze_page .line_chart_wrap .horizontal .bar_chart_area .row .row_value,
.analyze_page .bar_chart_wrap .horizontal .line_chart_area .row .row_value,
.analyze_page .bar_chart_wrap .horizontal .bar_chart_area .row .row_value {
  width: 85%;
  height: 40px;
  position: relative;
}
.analyze_page .line_chart_wrap .horizontal .line_chart_area .row .row_value .stacked_bar_chart,
.analyze_page .line_chart_wrap .horizontal .bar_chart_area .row .row_value .stacked_bar_chart,
.analyze_page .bar_chart_wrap .horizontal .line_chart_area .row .row_value .stacked_bar_chart,
.analyze_page .bar_chart_wrap .horizontal .bar_chart_area .row .row_value .stacked_bar_chart {
  height: 40px;
  position: relative;
  display: flex;
  align-items: center;
}
.analyze_page .line_chart_wrap .horizontal .line_chart_area .row .row_value .stacked_bar_chart .label,
.analyze_page .line_chart_wrap .horizontal .bar_chart_area .row .row_value .stacked_bar_chart .label,
.analyze_page .bar_chart_wrap .horizontal .line_chart_area .row .row_value .stacked_bar_chart .label,
.analyze_page .bar_chart_wrap .horizontal .bar_chart_area .row .row_value .stacked_bar_chart .label {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  filter: invert(100%) grayscale(100%) contrast(100);
  text-align: center;
}
.analyze_page .line_chart_wrap .horizontal .line_chart_area .row .row_value .stacked_bar_chart .label span,
.analyze_page .line_chart_wrap .horizontal .bar_chart_area .row .row_value .stacked_bar_chart .label span,
.analyze_page .bar_chart_wrap .horizontal .line_chart_area .row .row_value .stacked_bar_chart .label span,
.analyze_page .bar_chart_wrap .horizontal .bar_chart_area .row .row_value .stacked_bar_chart .label span {
  font-size: 16px;
}
.analyze_page .line_chart_wrap .horizontal .label_area,
.analyze_page .bar_chart_wrap .horizontal .label_area {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 24px 0px;
}
.analyze_page .line_chart_wrap .horizontal .label_area .label,
.analyze_page .bar_chart_wrap .horizontal .label_area .label {
  display: flex;
  align-items: center;
  margin: 0px 4px;
}
.analyze_page .line_chart_wrap .horizontal .label_area .label .label_color,
.analyze_page .bar_chart_wrap .horizontal .label_area .label .label_color {
  width: 12px;
  height: 12px;
  margin-right: 4px;
}
.analyze_page .line_chart_wrap .horizontal .label_area .label .label_title,
.analyze_page .bar_chart_wrap .horizontal .label_area .label .label_title {
  color: #666666;
}
.analyze_page .line_chart_wrap .vertical,
.analyze_page .bar_chart_wrap .vertical {
  position: relative;
}
.analyze_page .line_chart_wrap .vertical.ruler,
.analyze_page .bar_chart_wrap .vertical.ruler {
  width: calc(100% - 50px);
  margin-left: 50px;
}
.analyze_page .line_chart_wrap .vertical .line_chart_area,
.analyze_page .line_chart_wrap .vertical .bar_chart_area,
.analyze_page .bar_chart_wrap .vertical .line_chart_area,
.analyze_page .bar_chart_wrap .vertical .bar_chart_area {
  width: 100%;
  display: flex;
  margin: 16px 0 40px;
}
.analyze_page .line_chart_wrap .vertical .line_chart_area .scale,
.analyze_page .line_chart_wrap .vertical .bar_chart_area .scale,
.analyze_page .bar_chart_wrap .vertical .line_chart_area .scale,
.analyze_page .bar_chart_wrap .vertical .bar_chart_area .scale {
  position: absolute;
  height: 1px;
  width: 100%;
  background-color: #eee;
  z-index: 1;
}
.analyze_page .line_chart_wrap .vertical .line_chart_area .column_value,
.analyze_page .line_chart_wrap .vertical .bar_chart_area .column_value,
.analyze_page .bar_chart_wrap .vertical .line_chart_area .column_value,
.analyze_page .bar_chart_wrap .vertical .bar_chart_area .column_value {
  position: relative;
  max-width: 140px;
  display: flex;
  align-items: end;
}
.analyze_page .line_chart_wrap .vertical .line_chart_area .column_value .stacked_bar_chart,
.analyze_page .line_chart_wrap .vertical .bar_chart_area .column_value .stacked_bar_chart,
.analyze_page .bar_chart_wrap .vertical .line_chart_area .column_value .stacked_bar_chart,
.analyze_page .bar_chart_wrap .vertical .bar_chart_area .column_value .stacked_bar_chart {
  margin: 0px auto;
  position: relative;
  z-index: 1;
}
.analyze_page .line_chart_wrap .vertical .line_chart_area .column_value .stacked_bar_chart .label,
.analyze_page .line_chart_wrap .vertical .bar_chart_area .column_value .stacked_bar_chart .label,
.analyze_page .bar_chart_wrap .vertical .line_chart_area .column_value .stacked_bar_chart .label,
.analyze_page .bar_chart_wrap .vertical .bar_chart_area .column_value .stacked_bar_chart .label {
  text-align: center;
  font-size: 12px;
  position: absolute;
  top: 0px;
  left: 50%;
  transform: translateY(-120%) translateX(-50%);
  color: #666666;
  display: flex;
  align-items: center;
}
.analyze_page .line_chart_wrap .vertical .line_chart_area .column_value .stacked_bar_chart .label span,
.analyze_page .line_chart_wrap .vertical .bar_chart_area .column_value .stacked_bar_chart .label span,
.analyze_page .bar_chart_wrap .vertical .line_chart_area .column_value .stacked_bar_chart .label span,
.analyze_page .bar_chart_wrap .vertical .bar_chart_area .column_value .stacked_bar_chart .label span {
  font-size: 12px;
}
.analyze_page .line_chart_wrap .vertical .line_chart_area .column_value .ruler_border,
.analyze_page .line_chart_wrap .vertical .bar_chart_area .column_value .ruler_border,
.analyze_page .bar_chart_wrap .vertical .line_chart_area .column_value .ruler_border,
.analyze_page .bar_chart_wrap .vertical .bar_chart_area .column_value .ruler_border {
  height: 5px;
  width: 1px;
  background-color: #CCC;
  bottom: -5px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  margin: 0 auto;
}
.analyze_page .line_chart_wrap .vertical .line_chart_area .column_title,
.analyze_page .line_chart_wrap .vertical .bar_chart_area .column_title,
.analyze_page .bar_chart_wrap .vertical .line_chart_area .column_title,
.analyze_page .bar_chart_wrap .vertical .bar_chart_area .column_title {
  position: absolute;
  bottom: 0px;
  right: 0px;
  left: 0px;
  transform: translateY(calc(100% + 10px));
  color: #666666;
  text-align: center;
}
.analyze_page .line_chart_wrap .vertical .ruler_area .horizontal_ruler_area,
.analyze_page .bar_chart_wrap .vertical .ruler_area .horizontal_ruler_area {
  position: absolute;
  width: 100%;
}
.analyze_page .line_chart_wrap .vertical .ruler_area .horizontal_ruler_area::after,
.analyze_page .bar_chart_wrap .vertical .ruler_area .horizontal_ruler_area::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #cccccc;
}
.analyze_page .line_chart_wrap .vertical .ruler_area .vertical_ruler_area,
.analyze_page .bar_chart_wrap .vertical .ruler_area .vertical_ruler_area {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 1px;
  height: 100%;
}
.analyze_page .line_chart_wrap .vertical .ruler_area .vertical_ruler_area .label_area,
.analyze_page .bar_chart_wrap .vertical .ruler_area .vertical_ruler_area .label_area {
  position: relative;
  height: 100%;
  width: 1px;
  background-color: #cccccc;
  margin-top: 0;
}
.analyze_page .line_chart_wrap .vertical .ruler_area .vertical_ruler_area .label_area .scale,
.analyze_page .bar_chart_wrap .vertical .ruler_area .vertical_ruler_area .label_area .scale {
  position: absolute;
  right: 0px;
  height: 1px;
  width: 10px;
  background-color: #cccccc;
}
.analyze_page .line_chart_wrap .vertical .ruler_area .vertical_ruler_area .label_area .label,
.analyze_page .bar_chart_wrap .vertical .ruler_area .vertical_ruler_area .label_area .label {
  display: flex;
  position: absolute;
  right: 12px;
  transform: translateY(-50%);
  font-size: 10px;
  color: #666666;
}
.analyze_page .line_chart_wrap .vertical .label_area,
.analyze_page .bar_chart_wrap .vertical .label_area {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px 0px 8px;
}
.analyze_page .line_chart_wrap .vertical .label_area .label,
.analyze_page .bar_chart_wrap .vertical .label_area .label {
  display: flex;
  align-items: center;
  margin: 0px 4px;
}
.analyze_page .line_chart_wrap .vertical .label_area .label .label_color,
.analyze_page .bar_chart_wrap .vertical .label_area .label .label_color {
  width: 12px;
  height: 12px;
  margin-right: 4px;
}
.analyze_page .line_chart_wrap .vertical .label_area .label .label_title,
.analyze_page .bar_chart_wrap .vertical .label_area .label .label_title {
  color: #666666;
}
.analyze_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area {
  width: 100%;
  padding: 16px;
}
.analyze_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area .row {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  padding: 8px 0px;
}
.analyze_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area .row .row_title {
  width: 15%;
  padding: 0px 8px;
}
.analyze_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area .row .row_value {
  height: 40px;
  position: relative;
}
.analyze_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area .row .row_value .stacked_bar_chart {
  height: 100%;
  position: relative;
  display: flex;
  align-items: center;
}
.analyze_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area .row .row_value .stacked_bar_chart .label {
  text-align: center;
  font-size: 12px;
  filter: invert(100%) grayscale(100%) contrast(100);
  position: absolute;
  transform: translateX(-50%);
}
.analyze_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area .row .row_value .stacked_bar_chart .label span {
  font-size: 16px;
}
.analyze_page .stacked_bar_chart_wrap .horizontal .label_area {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 16px 0px 8px;
}
.analyze_page .stacked_bar_chart_wrap .horizontal .label_area .label {
  display: flex;
  align-items: center;
  margin: 0px 4px;
}
.analyze_page .stacked_bar_chart_wrap .horizontal .label_area .label .label_color {
  width: 12px;
  height: 12px;
  margin-right: 4px;
}
.analyze_page .stacked_bar_chart_wrap .horizontal .label_area .label .label_title {
  color: #666666;
}
.analyze_page .stacked_bar_chart_wrap .vertical .stacked_bar_chart_area {
  width: 100%;
  display: flex;
  margin: 16px 0 22px;
}
.analyze_page .stacked_bar_chart_wrap .vertical .stacked_bar_chart_area .column_value {
  position: relative;
  max-width: 140px;
  display: flex;
  align-items: end;
}
.analyze_page .stacked_bar_chart_wrap .vertical .stacked_bar_chart_area .column_value .stacked_bar_chart {
  margin: 0px auto;
  position: relative;
}
.analyze_page .stacked_bar_chart_wrap .vertical .stacked_bar_chart_area .column_value .stacked_bar_chart .label {
  text-align: center;
  font-size: 12px;
  filter: invert(100%) grayscale(100%) contrast(100);
  position: absolute;
  right: 0px;
  left: 0px;
  transform: translateY(-50%);
}
.analyze_page .stacked_bar_chart_wrap .vertical .stacked_bar_chart_area .column_value .stacked_bar_chart .label span {
  font-size: 16px;
}
.analyze_page .stacked_bar_chart_wrap .vertical .stacked_bar_chart_area .column_title {
  position: absolute;
  bottom: 0px;
  right: 0px;
  left: 0px;
  transform: translateY(calc(100% + 10px));
  color: #666666;
  text-align: center;
}
.analyze_page .stacked_bar_chart_wrap .vertical .label_area {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px 0px 8px;
}
.analyze_page .stacked_bar_chart_wrap .vertical .label_area .label {
  display: flex;
  align-items: center;
  margin: 0px 4px;
}
.analyze_page .stacked_bar_chart_wrap .vertical .label_area .label .label_color {
  width: 12px;
  height: 12px;
  margin-right: 4px;
}
.analyze_page .stacked_bar_chart_wrap .vertical .label_area .label .label_title {
  color: #666666;
}
.analyze_page .table_list_wrap .table_list {
  min-height: 282px;
}
.analyze_page .table_list_wrap .table_list table {
  width: 100%;
}
.analyze_page .table_list_wrap .table_list table thead tr {
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
}
.analyze_page .table_list_wrap .table_list table thead tr th {
  padding: 16px 8px;
  background-color: #eeeeee;
  text-align: center;
  vertical-align: middle;
}
.analyze_page .table_list_wrap .table_list table thead tr th .group {
  display: flex;
  justify-content: space-around;
}
.analyze_page .table_list_wrap .table_list table thead tr th .table_header {
  display: flex;
  justify-content: center;
  cursor: pointer;
}
.analyze_page .table_list_wrap .table_list table thead tr th .table_header .sort_icon_area {
  margin-left: 4px;
}
.analyze_page .table_list_wrap .table_list table tbody tr {
  border-bottom: 1px solid #cccccc;
}
.analyze_page .table_list_wrap .table_list table tbody tr .group {
  display: flex;
  justify-content: space-around;
}
.analyze_page .table_list_wrap .table_list table tbody tr td {
  padding: 16px 8px;
  text-align: center;
  vertical-align: middle;
  word-break: break-all;
}
.analyze_page .table_list_wrap .pagination {
  display: flex;
  justify-content: flex-end;
  margin: 30px 0;
}
.analyze_page .table_list_wrap .pagination .page {
  padding: 4px 8px;
  cursor: pointer;
  margin: 0px 4px;
  min-width: 42px;
  text-align: center;
  color: #666666;
  display: flex;
  align-items: center;
}
.analyze_page .table_list_wrap .pagination .page:hover {
  color: #333333;
}
.analyze_page .table_list_wrap .pagination .page.selected {
  color: #0041f3;
  font-size: 16px;
  font-weight: bold;
}
.analyze_page .table_list_wrap .pagination .page.disabled {
  color: #CCCCCC;
  cursor: not-allowed;
}
.analyze_page .download_csv_area {
  font-size: 12px;
  position: relative;
  display: flex;
  justify-content: flex-end;
}
.analyze_page .download_csv_area button {
  display: inline-block;
  border: 1px solid #4472ba;
  border-radius: 4px;
  padding: 7px 16px;
}
.analyze_page .download_csv_area button.toggle {
  align-items: center;
  background-color: rgba(68, 114, 186, 0.1);
  color: #4472BA;
  display: flex;
}
.analyze_page .download_csv_area button.toggle .icon {
  height: 24px;
  width: 24px;
}
.analyze_page .download_csv_area button.toggle svg g {
  fill: #4472BA;
}
.analyze_page .download_csv_area button.toggle:hover {
  color: #FFFFFF;
  background-color: #4472BA;
}
.analyze_page .download_csv_area button.toggle:hover svg g {
  fill: #FFFFFF;
}
.analyze_page .download_csv_area button.download {
  color: #656E73;
  background-color: #FFFFFF;
}
.analyze_page .download_csv_area button.download:hover {
  color: #FFFFFF;
  background-color: #656E73;
}
.analyze_page .download_csv_area button:disabled {
  color: #CCCCCC;
  background-color: #FAFAFA;
  border: solid 1px #EEEEEE;
}
.analyze_page .download_csv_area button:disabled:hover {
  color: #CCCCCC;
  background-color: #FAFAFA;
}
.analyze_page .download_csv_area .download_csv_modal {
  display: block;
  background-color: #FFFFFF;
  position: absolute;
  top: 50px;
  right: 0;
  z-index: 2050;
  text-align: left;
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  box-shadow: 0px 0px 3px #CCCCCC;
  width: max-content;
}
.analyze_page .download_csv_area .download_csv_modal.none {
  display: none;
}
.analyze_page .download_csv_area .download_csv_modal .modal_title {
  padding: 16px;
  border-bottom: 1px solid #CCCCCC;
}
.analyze_page .download_csv_area .download_csv_modal .detail {
  padding: 16px;
}
.analyze_page .download_csv_area .download_csv_modal .detail .button_area {
  display: flex;
  justify-content: space-between;
}
.analyze_page .download_csv_area .download_csv_modal .detail .button_area button {
  margin-right: 16px;
}
.analyze_page .download_csv_area .download_csv_modal .detail .button_area button:last-of-type {
  margin-right: 0;
}
.analyze_page .download_csv_area .download_csv_modal .detail .comment {
  margin: 16px 0 0 0;
  color: #A8AFB4;
  font-size: 12px;
}

.task_page .permission_legend {
  border: 1px solid #cccccc;
  border-radius: 4px;
  background-color: #ffffff;
  padding: 24px;
  display: flex;
  flex-flow: column;
  gap: 4px;
  margin-top: 40px;
}
.task_page .permission_legend .legend_title {
  font-weight: bold;
  font-size: 14px;
  padding: 4px;
}
.task_page .permission_legend .legend_area {
  display: flex;
  flex-flow: column;
  gap: 4px;
}
.task_page .permission_legend .row {
  border: 1px solid #cccccc;
  border-radius: 4px;
  background-color: #FAFAFA;
  padding: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .permission_legend .row .left_area {
  min-width: 230px;
  display: flex;
  justify-content: center;
}
.task_page .permission_legend .label {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  background-color: #000000;
  color: #ffffff;
  padding: 4px 8px;
  border-radius: 4px;
  width: fit-content;
}
.task_page .permission_legend .label.project_setting {
  background-color: #3a5f99;
}
.task_page .permission_legend .label.cost_view {
  background-color: #09984c;
}
.task_page .permission_legend .label.member_cost_setting {
  background-color: #988409;
}
.task_page .permission_legend .label.project_cost_setting {
  background-color: #5a11c3;
}
.task_page .permission_legend .label.project_export {
  background-color: #1978d6;
}
.task_page .permission_legend .label.attendance_export {
  background-color: #dd851f;
}
.task_page .modal_box.create_project_modal {
  width: 920px;
  max-height: 500px;
  overflow-y: auto;
  overflow-x: hidden;
}
.task_page .modal_box.create_project_modal .select_type_wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
}
.task_page .modal_box.create_project_modal .select_type_wrapper button {
  border: 3px solid #017b23;
  border-radius: 4px;
  width: 100%;
  height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  background-color: #00661c;
  color: #ffffff;
  position: relative;
}
.task_page .modal_box.create_project_modal .select_type_wrapper button.new {
  border: 3px solid #f19b04;
  background-color: #d08400;
}
.task_page .modal_box.create_project_modal .select_type_wrapper button.generic {
  border: 3px solid #086bd5;
  background-color: #0453a8;
}
.task_page .modal_box.create_project_modal .select_type_wrapper button.custom {
  border: 3px solid #8128d9;
  background-color: #5913a0;
}
.task_page .modal_box.create_project_modal .select_type_wrapper button.occupation {
  border: 3px solid #2fc6e3;
  background-color: #12acc8;
}
.task_page .modal_box.create_project_modal .select_type_wrapper button.case {
  border: 3px solid #268ef5;
  background-color: #0e6ec8;
}
.task_page .modal_box.create_project_modal .select_type_wrapper button.csv {
  border: 3px solid #017b23;
  background-color: #00661c;
}
.task_page .modal_box.create_project_modal .select_type_wrapper button .type_icon_area {
  font-size: 40px;
  margin-bottom: 16px;
}
.task_page .modal_box.create_project_modal .select_type_wrapper button .type_text_area {
  font-size: 14px;
  font-weight: bold;
  white-space: nowrap;
  text-align: center;
  display: flex;
  flex-flow: column;
  gap: 4px;
}
.task_page .modal_box.create_project_modal .select_type_wrapper button:hover {
  opacity: 0.8;
}
.task_page .modal_box.create_project_modal .template_list {
  display: flex;
  justify-content: center;
  flex-flow: column;
  gap: 16px;
}
.task_page .modal_box.create_project_modal .template_list .template_block {
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
}
.task_page .modal_box.create_project_modal .template_list .template_block .template_title_area {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 8px;
}
.task_page .modal_box.create_project_modal .template_list .template_block .template_title_area .template_title_color {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #999999;
}
.task_page .modal_box.create_project_modal .template_list .template_block .template_title_area .template_title {
  font-size: 14px;
  font-weight: bold;
}
.task_page .modal_box.create_project_modal .template_list .template_block .template_description {
  margin-left: 8px;
  margin-bottom: 8px;
}
.task_page .modal_box.create_project_modal .template_list .template_block .template_detail {
  display: flex;
  gap: 4px;
  padding: 4px;
  flex-flow: column;
}
.task_page .modal_box.create_project_modal .template_list .template_block .template_detail .template_detail_title {
  white-space: nowrap;
  padding-top: 3px;
}
.task_page .modal_box.create_project_modal .template_list .template_block .template_detail .template_tips {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.task_page .modal_box.create_project_modal .template_list .template_block .template_detail .template_tips .template_tip {
  background-color: #eeeeee;
  padding: 4px 8px;
  border-radius: 10px;
  font-size: 10px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .modal_box.create_project_modal .template_list .template_block .template_detail .template_tips .template_tip .red_label {
  background-color: #ff0000;
  border-radius: 8px;
  padding: 2px 4px;
  font-size: 8px;
  height: 12px;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.task_page .modal_box.create_project_modal .template_list .template_block .template_button_area {
  margin-top: 8px;
  text-align: right;
}
.task_page .modal_box.create_project_modal .template_list .template_block .template_button_area button {
  border-radius: 4px;
  background-color: #00661c;
  color: #ffffff;
}
.task_page .modal_box.create_project_modal .template_list .template_block .template_button_area button:hover {
  opacity: 0.8;
}
.task_page .modal_box.create_project_modal .template_list .no_data_area {
  text-align: center;
}
.task_page .modal_box.create_project_modal .template_list .no_data_area .no_data {
  font-size: 22px;
  color: #999999;
  margin-bottom: 24px;
}
.task_page button.download {
  border: solid 1px #008000;
  border-radius: 4px;
  color: #008000;
  background-color: #FFF;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page button.download .csv_icon {
  width: 16px;
  height: 16px;
}
.task_page button.download:hover {
  background-color: #ecffec;
}
.task_page .card_frame {
  display: flex;
  align-items: start;
  flex-flow: wrap;
  gap: 8px;
}
.task_page .card_frame .card {
  width: calc(33.3333333333% - 8px);
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
  cursor: pointer;
  position: relative;
}
.task_page .card_frame .card .detail_area {
  width: 100%;
  margin-bottom: 24px;
}
.task_page .card_frame .card .detail_area .title {
  font-size: 20px;
  font-weight: bold;
  margin: 16px 0px;
  text-align: center;
}
.task_page .card_frame .card .detail_area .text {
  text-align: center;
  color: #666666;
}
.task_page .card_frame .card .image_area {
  width: 100%;
  display: flex;
  align-items: center;
}
.task_page .card_frame .card .image_area img {
  width: 100%;
  margin: auto;
  border-radius: 5px;
  border: solid 1px #CCC;
}
.task_page .card_frame .card:hover {
  opacity: 0.7;
}
.task_page .title {
  gap: 8px;
}
.task_page .title .button_area {
  position: relative;
}
.task_page .title .button_area button.reload {
  border: solid 1px #CCCCCC;
  border-radius: 4px;
  font-size: 14px;
  padding: 4px 8px;
  color: #666666;
  margin: 0;
  background-color: #FFFFFF;
}
.task_page .title .button_area button.reload:hover {
  background-color: #EEEEEE;
}
.task_page .title .button_area button.reload:disabled {
  color: #999999;
}
.task_page .title .button_area button.reload:disabled:hover {
  background-color: #EEEEEE;
}
.task_page .tools {
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .tools .display_switch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px;
  border: 1px solid #4472ba;
  border-radius: 40px;
  margin-left: 8px;
  background-color: #4472ba;
  gap: 4px;
}
.task_page .tools .display_switch > div {
  border-radius: 18px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  position: relative;
  padding: 0 8px;
}
.task_page .tools .display_switch > div span {
  font-size: 10px;
  margin-left: 4px;
}
.task_page .tools .display_switch > div:nth-of-type(1) {
  background-color: transparent;
  color: #FFFFFF;
}
.task_page .tools .display_switch > div:nth-of-type(2) {
  background-color: #FFFFFF;
  color: #4372BA;
}
.task_page .tools .display_switch > div .help {
  height: auto;
}
.task_page .tools .display_switch.check > div:nth-of-type(1) {
  background-color: #FFFFFF;
  color: #4372BA;
}
.task_page .tools .display_switch.check > div:nth-of-type(2) {
  background-color: transparent;
  color: #FFFFFF;
}
.task_page .tools .display_switch.labeling {
  border: 1px solid #A3A3A3;
  background-color: #FFFFFF;
}
.task_page .tools .display_switch.labeling > div:nth-of-type(1) {
  background-color: transparent;
  color: #666666;
}
.task_page .tools .display_switch.labeling > div:nth-of-type(2) {
  background-color: #666666;
  color: #FFFFFF;
}
.task_page .tools .display_switch.labeling.check > div:nth-of-type(1) {
  background-color: #0B9554;
  color: #FFFFFF;
}
.task_page .tools .display_switch.labeling.check > div:nth-of-type(2) {
  background-color: transparent;
  color: #666666;
}
.task_page .tools .display_switch.labeling_status {
  border: 1px solid #A3A3A3;
  background-color: #FFFFFF;
}
.task_page .tools .display_switch.labeling_status > div:nth-of-type(1) {
  background-color: transparent;
  color: #666666;
}
.task_page .tools .display_switch.labeling_status > div:nth-of-type(2) {
  background-color: #0B9554;
  color: #FFFFFF;
}
.task_page .tools .display_switch.labeling_status.check > div:nth-of-type(1) {
  background-color: #0B9554;
  color: #FFFFFF;
}
.task_page .tools .display_switch.labeling_status.check > div:nth-of-type(2) {
  background-color: transparent;
  color: #666666;
}
.task_page .tools .display_switch.labeling_status.sticky {
  position: fixed;
  top: 80px;
  right: 60px;
  z-index: 1010;
}
.task_page .grid_contents {
  background-color: transparent;
  box-shadow: none;
  padding: 0;
}
.task_page .grid_contents .grid_contents_title {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 24px;
  display: inline-block;
  position: relative;
}
.task_page .grid_contents .grid_contents_area {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
.task_page .grid_contents .grid_contents_area .grid_block {
  width: calc(50% - 8px);
  border-radius: 4px;
  padding: 16px;
  background-color: #FFFFFF;
  box-shadow: 0 0 4px #CCCCCC;
}
.task_page .grid_contents .grid_contents_area .grid_block .title {
  font-size: 24px;
  margin-bottom: 16px;
}
.task_page .grid_contents .grid_contents_area .grid_block table {
  width: 100%;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr {
  border-top: solid 1px #CCCCCC;
  border-bottom: solid 1px #CCCCCC;
  font-weight: bold;
  color: #999999;
  background-color: #EEEEEE;
  position: relative;
  display: -webkit-flex;
  margin-bottom: -1px;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td {
  padding: 12px 8px;
  display: flex;
  align-items: center;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td:nth-of-type(1) {
  width: 12%;
  justify-content: center;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td:nth-of-type(2) {
  width: 78%;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td:nth-of-type(3) {
  width: 10%;
  justify-content: flex-end;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td .status {
  padding: 4px;
  font-size: 10px;
  white-space: nowrap;
  width: fit-content;
  border-radius: 2px;
  color: #FFFFFF;
  background-color: #4372ba;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td .status:hover {
  background-color: #80adf1;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td .status.registered {
  background-color: #008800;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td .status.registered:hover {
  background-color: #008800;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td .status.red {
  background-color: #FF0000;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td .status.red:hover {
  background-color: #ff8e8e;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td .status.pending {
  background-color: #666666;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td .status.pending:hover {
  background-color: #666666;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td .status.not_allowed {
  background-color: #999999;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td .status.not_allowed:hover {
  background-color: #999999;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr td .status .tip_wrap {
  top: -6px;
  left: 47%;
}
.task_page .grid_contents .grid_contents_area .grid_block table tr.registered {
  color: #4372ba;
  background-color: #FFFFFF;
}
.task_page .mini_menu {
  display: block;
  background-color: #FFFFFF;
  border-radius: 8px;
  box-shadow: 0px 0px 5px #CCCCCC;
  border: 1px solid #CCCCCC;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2040;
  transform: translateX(-30%);
  min-width: 154px;
}
.task_page .mini_menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.task_page .mini_menu ul li {
  align-items: center;
  cursor: pointer;
}
.task_page .mini_menu ul li:first-child {
  border-radius: 8px 8px 0 0;
}
.task_page .mini_menu ul li:first-child button {
  border-radius: 8px 8px 0 0;
}
.task_page .mini_menu ul li:last-child {
  border-radius: 0 0 8px 8px;
  color: #C61616;
}
.task_page .mini_menu ul li:last-child button {
  border-radius: 0 0 8px 8px;
}
.task_page .mini_menu ul li.red {
  color: #C61616;
}
.task_page .mini_menu ul li.red .icon svg {
  fill: #C61616;
}
.task_page .mini_menu ul li .icon {
  width: 24px;
  height: 24px;
  margin-right: 4px;
}
.task_page .mini_menu ul li .icon svg g use {
  fill: currentColor;
}
.task_page .mini_menu ul li:hover {
  background-color: #F5F5F5;
}
.task_page .mini_menu ul li button {
  width: 100%;
  display: flex;
  align-items: center;
  padding: 8px 16px 8px 8px;
  background-color: transparent;
  border: none;
}
.task_page .mini_menu ul li button:focus {
  outline: none;
}
.task_page .mini_menu ul li button:disabled {
  background-color: #F5F5F5;
  color: #999999;
}
.task_page .mini_menu.none {
  display: none;
}
.task_page .tips {
  position: relative;
}
.task_page .tip_wrap {
  position: absolute;
  left: 50%;
  top: -10px;
  transform: translateY(-120%) translateX(-50%);
  background-color: #FFFFFF;
  color: #666666;
  padding: 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: initial;
  border: solid 1px #666666;
  z-index: 1999;
}
.task_page .tip_wrap .tip {
  position: relative;
  white-space: nowrap;
}
.task_page .tip_wrap .tip::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #FFFFFF;
  position: absolute;
  bottom: -17px;
  left: 50%;
  margin: auto;
  transform: rotate(45deg) translateX(-50%);
  z-index: 0;
  border-bottom: solid 1px #666666;
  border-right: solid 1px #666666;
}
.task_page .tip_wrap .tip div:not(:last-of-type) {
  margin-bottom: 4px;
}
.task_page .tips:hover .tip_wrap {
  display: block;
}
.task_page .help {
  height: 100%;
  position: relative;
  min-width: 1px;
}
.task_page .help .icon {
  margin-left: 4px;
}
.task_page .help.cog {
  color: #666666;
  font-size: 16px;
  min-width: unset;
}
.task_page .help.del {
  color: #ff0000;
  font-size: 16px;
  min-width: unset;
}
.task_page .help.undo {
  color: #0094b1;
  font-size: 16px;
  min-width: unset;
}
.task_page .help.disabled {
  color: #CCCCCC;
  font-size: 16px;
  min-width: unset;
}
.task_page .help.disabled button {
  cursor: not-allowed;
}
.task_page .help.height_auto {
  height: auto;
}
.task_page .help.inner_graph {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.task_page .help.inner_graph .tip_wrap {
  text-align: center;
}
.task_page .help.bottom .tip_wrap {
  bottom: -75px;
  top: unset;
}
.task_page .help.bottom .tip_wrap .tip::before {
  content: "";
  bottom: unset;
  top: -17px;
  left: 14%;
  transform: rotate(225deg) translateX(-50%);
}
.task_page .help.bottom .tip_wrap .tip div:not(:last-of-type) {
  margin-bottom: 4px;
}
.task_page .help.side_view .tip_wrap {
  left: 105%;
  top: 50%;
  transform: translateY(-50%);
  font-size: 10px;
  padding: 4px 8px;
  border: solid 1px #999999;
  color: #999;
}
.task_page .help.side_view .tip_wrap .tip::before {
  bottom: 0;
  left: -14px;
  width: 6px;
  height: 6px;
  transform: rotate(135deg) translateX(-50%);
  border-bottom: solid 1px #999999;
  border-right: solid 1px #999999;
}
.task_page .search_button {
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 10px 16px;
  background-color: #ffffff;
  margin-right: 8px;
  font-size: 12px;
}
.task_page .search_area {
  position: relative;
  margin-right: 8px;
  font-size: 14px;
  display: block;
  z-index: 1999;
  top: 0px;
  padding: 0px;
  box-shadow: none;
}
.task_page .search_box {
  right: 0;
  padding: 16px;
  position: absolute;
  top: 40px;
  display: block;
  background-color: #FFFFFF;
  box-shadow: 0px 3px 6px #00000029;
  border-radius: 8px;
  z-index: 2110;
  font-size: 12px;
}
.task_page .search_box.none {
  display: none;
}
.task_page .search_box.natural {
  right: unset;
}
.task_page .search_box .search_detail {
  width: 600px;
  max-height: 300px;
  overflow: auto;
  scrollbar-width: none;
}
.task_page .search_box .search_detail::-webkit-scrollbar {
  display: none;
}
.task_page .search_box .search_detail .category {
  margin-bottom: 16px;
}
.task_page .search_box .search_detail .category .category_title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  padding: 8px 4px;
  border-bottom: 1px solid #cccccc;
  margin-bottom: 8px;
}
.task_page .search_box .search_detail .category .category_title .select_reset {
  font-size: 10px;
  cursor: pointer;
  color: #4572BA;
}
.task_page .search_box .search_detail .category .category_title .special_button_area {
  display: flex;
  gap: 4px;
}
.task_page .search_box .search_detail .category .category_title .special_button_area button {
  border-radius: 24px;
  background-color: #000000;
  font-size: 10px;
  color: #FFFFFF;
  padding: 4px 8px;
}
.task_page .search_box .search_detail .category .category_title .special_button_area button.break {
  background-color: #e88042;
}
.task_page .search_box .search_detail .category .category_title .special_button_area button.other {
  background-color: #0493b1;
}
.task_page .search_box .search_detail .category .category_title .special_button_area button.not_working {
  background-color: #666666;
}
.task_page .search_box .search_detail .category .category_title .special_button_area button:hover {
  opacity: 0.8;
}
.task_page .search_box .search_detail .category .disable_option {
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: "pointer";
  user-select: "none";
}
.task_page .search_box .search_detail .category .disable_option .icon_back {
  display: none;
}
.task_page .search_box .search_detail .category .disable_option .icon {
  font-size: 10px;
}
.task_page .search_box .search_detail .category .disable_option .icon.enabled {
  color: #08984C;
}
.task_page .search_box .search_detail .category .disable_option .icon.disabled {
  color: #666666;
}
.task_page .search_box .search_detail .category .disable_option .text {
  font-size: 10px;
  line-height: 1;
}
.task_page .search_box .search_detail .category .search_area {
  position: relative;
  width: 100%;
  margin-bottom: 8px;
  background-color: #FFFFFF;
  border: solid 1px #CCCCCC;
  padding: 0 8px;
  border-radius: 4px;
  font-size: 12px;
  display: flex;
  align-items: center;
}
.task_page .search_box .search_detail .category .search_area.disabled {
  background-color: #F5F5F5;
  border-color: #DDDDDD;
  cursor: not-allowed;
}
.task_page .search_box .search_detail .category .search_area.disabled .icon {
  color: #AAAAAA;
}
.task_page .search_box .search_detail .category .search_area.disabled input[type=text] {
  color: #999999;
  cursor: not-allowed;
}
.task_page .search_box .search_detail .category .search_area.disabled input[type=text]::placeholder {
  color: #CCCCCC;
}
.task_page .search_box .search_detail .category .search_area .icon {
  margin-right: 8px;
}
.task_page .search_box .search_detail .category .search_area input[type=text] {
  width: 100%;
  font-size: 12px;
  border: none;
  background-color: transparent;
  padding: 8px 16px;
}
.task_page .search_box .search_detail .category .search_area input[type=text]:focus {
  padding: 8px 16px;
}
.task_page .search_box .search_detail .category .search_area .reset {
  padding: 4px;
}
.task_page .search_box .search_detail .category .group_title {
  margin: 8px 4px;
  background-color: #FFFFFF;
  position: relative;
  z-index: 0;
  display: inline-block;
  margin-left: 8px;
  padding: 0 4px;
}
.task_page .search_box .search_detail .category .chip_list {
  display: flex;
  align-items: center;
  flex-flow: wrap;
  gap: 4px;
  border: solid 1px #EEE;
  padding: 8px;
}
.task_page .search_box .search_detail .category .chip_list.limit {
  max-height: 125px;
  overflow-y: auto;
}
.task_page .search_box .search_detail .category .chip_list .no_result {
  width: 100%;
  text-align: center;
  color: #999999;
}
.task_page .search_box .search_detail .category button.chip {
  background: #FFFFFF;
  border: solid 1px #CCCCCC;
  padding: 8px 10px;
  color: #333333;
  border-radius: 14px;
  display: inline-block;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
}
.task_page .search_box .search_detail .category button.chip.checked {
  color: #00a012;
  background-color: #e0f4e2;
}
.task_page .search_box .search_detail .category button.chip:hover {
  opacity: 0.75;
}
.task_page .search_box .search_detail .category button.chip.disabled {
  color: #AAAAAA;
  cursor: not-allowed;
  background-color: #F5F5F5;
}
.task_page .search_box .search_detail .category button.chip.disabled:hover {
  opacity: 1;
}
.task_page .search_box .search_detail .category label {
  display: flex;
  align-items: center;
  margin: 8px 4px;
}
.task_page .search_box .search_detail .category label input[type=checkbox] {
  margin-right: 4px;
}
.task_page .search_box .search_detail .category button.add_label {
  width: max-content;
  white-space: nowrap;
  border-radius: 4px;
  background-color: #d6e8d4;
  border: 1px solid #81b365;
  color: #81b365;
  font-size: 12px;
}
.task_page .search_box .search_detail .category button.add_label:disabled {
  background-color: #DDDDDD;
  color: #999999;
  border-color: #999999;
  cursor: not-allowed;
}
.task_page .search_box.select_category {
  white-space: nowrap;
  width: 100%;
  max-height: 200px;
  overflow-y: scroll;
}
.task_page .search_box.select_category .row {
  display: flex;
  gap: 4px;
  padding: 8px;
  border-bottom: 1px solid #cccccc;
  background-color: #ffffff;
  cursor: pointer;
}
.task_page .search_box.select_category .row.not_allowed {
  cursor: not-allowed;
  background-color: #eeeeee;
}
.task_page .search_box.select_category .row .row_detail {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .search_box.select_category .row .row_detail .selected_label {
  background-color: #ff0000;
  font-size: 8px;
  border-radius: 4px;
  color: #ffffff;
  padding: 2px 4px;
}
.task_page .search_box.select_category .row .row_detail .help {
  height: auto;
}
.task_page .search_condition {
  margin-bottom: 8px;
  position: relative;
  background-color: #ffffff;
  color: #666666;
  padding: 16px;
  box-shadow: #cccccc 0px 0px 4px;
}
.task_page .sticky_header .sticky_header_title {
  padding: 0px 4px;
  margin-bottom: 16px;
  font-size: 20px;
}
.task_page .search_condition_title {
  padding: 0px 4px;
  margin-bottom: 8px;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.task_page .project_display_type_select_wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
  box-shadow: #cccccc 0px 0px 4px;
  background-color: #ffffff;
  margin-bottom: 16px;
  padding: 16px;
}
.task_page .project_display_type_select_wrapper button {
  border-radius: 4px;
  background-color: #999999;
  color: #FFFFFF;
  position: relative;
}
.task_page .project_display_type_select_wrapper button .pick_up {
  position: absolute;
  top: -8px;
  right: -10px;
  background-color: #ff0000;
  padding: 2px 4px;
  font-size: 9px;
  border-radius: 10px;
}
.task_page .project_display_type_select_wrapper button:hover {
  opacity: 0.8;
}
.task_page .chip_wrap {
  display: flex;
  align-items: center;
  white-space: nowrap;
  flex-wrap: wrap;
}
.task_page .chip_wrap .chip_area {
  margin: 4px;
  display: flex;
  align-items: center;
}
.task_page .chip_wrap .chip_area .chip {
  background-color: #dddddd;
  border-radius: 20px;
  padding: 4px 8px;
}
.task_page .chip_wrap .chip_area .chip_list {
  display: flex;
  align-items: center;
  white-space: nowrap;
  flex-wrap: wrap;
}
.task_page .chip_wrap .chip_area .chip_list .chip {
  margin: 4px;
}
.task_page .button_area .button {
  display: inline-block;
  text-align: center;
  min-width: 200px;
  background-color: #4472ba;
  border: 1px solid #4472ba;
  color: #ffffff;
  padding: 8px 12px;
  border-radius: 4px;
}
.task_page .button_area .button:hover {
  opacity: 0.9;
}
.task_page .button_area .button:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}
.task_page .button_area .button.cancel {
  background-color: #666666;
  border: solid 1px #666666;
}
.task_page .button_area .group_button {
  background-color: #4472ba;
  border: 1px solid #4472ba;
  color: #ffffff;
  border-radius: 4px;
  width: fit-content;
  cursor: pointer;
  display: flex;
  align-items: center;
}
.task_page .button_area .group_button .main_contents {
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .button_area .group_button .main_contents:hover {
  background-color: #FFFFFF0d;
}
.task_page .button_area .group_button .separator {
  width: 1px;
  height: 24px;
  background-color: #223d68;
}
.task_page .button_area .group_list {
  position: absolute;
  width: 100%;
  z-index: 2004;
  background-color: #ffffff;
  border-radius: 4px;
  padding: 4px;
  display: flex;
  flex-flow: column;
  gap: 4px;
}
.task_page .button_area .group_list > button {
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .button_area .group_list > button:hover {
  color: #52a7dd;
  background-color: #f0f8ff;
}
.task_page .grid_area {
  display: flex;
  flex-flow: wrap;
  margin-bottom: 24px;
}
.task_page .grid_area .grid_block {
  width: 100%;
  margin: 1%;
  border-radius: 4px;
  padding: 8px;
}
.task_page .grid_area .grid_block .title {
  font-size: 18px;
  font-weight: bold;
  color: #666666;
  padding: 8px;
}
.task_page .grid_area .grid_block .title.center {
  text-align: center;
}
.task_page .grid_area .grid_block .value {
  text-align: center;
  font-size: 20px;
  color: #666666;
}
.task_page .grid_area .grid_block .value strong {
  text-align: center;
  font-size: 100px;
  font-weight: bold;
  color: #4471b9;
}
.task_page .grid_area .grid_block .value.ratio {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 60px;
}
.task_page .grid_area .grid_block.block_9 {
  width: 73%;
}
.task_page .grid_area .grid_block.block_8 {
  width: 64.6666666667%;
}
.task_page .grid_area .grid_block.block_6 {
  width: 48%;
}
.task_page .grid_area .grid_block.block_4 {
  width: 31.3333333333%;
}
.task_page .grid_area .grid_block.block_3 {
  width: 23%;
}
.task_page .grid_area .grid_block.block_2 {
  width: 14.6666666667%;
}
.task_page .grid_area .grid_block.no_border {
  border: none;
}
.task_page .grid_area .grid_block.grid_title {
  margin: 0;
  border: none;
  font-size: 18px;
  font-weight: bold;
  color: #666666;
}
.task_page .grid_area .grid_block.reverse {
  background-color: #4471b9;
  border: none;
}
.task_page .grid_area .grid_block.reverse .title {
  color: #FFFFFF;
}
.task_page .grid_area .grid_block.reverse .value {
  color: #FFFFFF;
}
.task_page .grid_area .grid_block.reverse .value strong {
  color: #FFFFFF;
}
.task_page .table_list_wrap .table_list {
  margin-bottom: 24px;
}
.task_page .table_list_wrap .table_list table {
  width: 100%;
}
.task_page .table_list_wrap .table_list table thead tr th {
  padding: 16px 8px;
  background-color: #eeeeee;
  text-align: center;
  vertical-align: middle;
  border: 1px solid #cccccc;
}
.task_page .table_list_wrap .table_list table thead tr th .group {
  display: flex;
  justify-content: space-around;
}
.task_page .table_list_wrap .table_list table thead tr th .table_header {
  display: flex;
  justify-content: center;
}
.task_page .table_list_wrap .table_list table thead tr th .table_header .sort_button {
  cursor: pointer;
}
.task_page .table_list_wrap .table_list table thead tr th .table_header .sort_icon_area {
  margin-left: 4px;
  cursor: pointer;
}
.task_page .table_list_wrap .table_list table tbody tr .group {
  display: flex;
  justify-content: space-around;
}
.task_page .table_list_wrap .table_list table tbody tr td {
  padding: 16px 8px;
  text-align: center;
  vertical-align: middle;
  word-break: break-all;
  border: 1px solid #cccccc;
  background-color: #FFFFFF;
}
.task_page .table_list_wrap .table_list table tbody tr td .mini_box {
  border: 1px solid #cccccc;
  background-color: #ffffff;
  margin-bottom: 16px;
  padding-bottom: 8px;
}
.task_page .table_list_wrap .table_list table tbody tr td .mini_box .title {
  padding: 8px;
  background-color: #eeeeee;
  margin-bottom: 8px;
  font-weight: normal;
}
.task_page .table_list_wrap .table_list table tbody tr td .mini_box .detail {
  display: flex;
  padding: 4px 8px;
  flex-wrap: wrap;
  gap: 8px;
  min-height: unset;
}
.task_page .table_list_wrap .table_list table tbody tr td .mini_box .detail div {
  background-color: #dddddd;
  border-radius: 20px;
  padding: 4px 8px;
  display: inline-block;
}
.task_page .table_list_wrap .table_list table tbody tr td .mini_box:nth-last-of-type(1) {
  margin-bottom: 0px;
}
.task_page .table_list_wrap .table_list table tbody tr.act:hover {
  background-color: #FAFAFA;
  cursor: pointer;
}
.task_page .table_list_wrap .table_list table tbody tr.disabled {
  background-color: #DDDDDD;
}
.task_page .table_list_wrap .table_list table tbody tr.disabled td .mini_box {
  background-color: #eeeeee;
}
.task_page .table_list_wrap .table_list table tbody tr.disabled td .mini_box .title {
  background-color: #d4d4d4;
}
.task_page .table_list_wrap .pagination {
  display: flex;
  justify-content: flex-end;
  margin: 30px 0;
}
.task_page .table_list_wrap .pagination .page {
  padding: 4px 8px;
  cursor: pointer;
  margin: 0px 4px;
  min-width: 42px;
  text-align: center;
  color: #666666;
  display: flex;
  align-items: center;
}
.task_page .table_list_wrap .pagination .page:hover {
  color: #333333;
}
.task_page .table_list_wrap .pagination .page.selected {
  color: #0041f3;
  font-size: 16px;
  font-weight: bold;
}
.task_page .table_list_wrap .pagination .page.disabled {
  color: #CCCCCC;
  cursor: not-allowed;
}
.task_page .table_list_wrap.summary {
  margin-left: 10%;
}
.task_page .table_list_wrap.summary .table_list table thead tr th {
  border: 1px solid #4372ba;
  color: #4372ba;
  padding: 8px;
  position: relative;
}
.task_page .table_list_wrap.summary .table_list table thead tr th:first-of-type {
  width: 30%;
  background-color: transparent;
  border: none;
}
.task_page .table_list_wrap.summary .table_list table thead tr th:nth-of-type(2) {
  width: 35%;
  background-color: #ffe5e5;
}
.task_page .table_list_wrap.summary .table_list table thead tr th:nth-of-type(3) {
  width: 35%;
  background-color: #ecfdea;
}
.task_page .table_list_wrap.summary .table_list table tbody tr td {
  border: 1px solid #4372ba;
  color: #4372ba;
  font-weight: bold;
  font-size: 18px;
  background-color: #FFFFFF;
}
.task_page .table_list_wrap.summary .table_list table tbody tr td:first-of-type {
  background-color: #F8F8F8;
}
.task_page .table_list_wrap.summary .small {
  font-size: 10px;
}
.task_page .table_list_wrap.labeling_table .table_list {
  margin-bottom: 0;
}
.task_page .table_list_wrap.labeling_table .table_list table thead tr th:nth-of-type(1) {
  width: 10%;
}
.task_page .table_list_wrap.labeling_table .table_list table thead tr th:nth-of-type(2) {
  width: 30%;
}
.task_page .table_list_wrap.labeling_table .table_list table thead tr th:nth-of-type(3) {
  width: 40%;
}
.task_page .table_list_wrap.labeling_table .table_list table thead tr th:nth-of-type(4) {
  width: 20%;
}
.task_page .table_list_wrap.labeling_table .table_list table tbody tr td:nth-of-type(1) > div {
  display: flex;
  align-items: center;
  justify-content: center;
}
.task_page .table_list_wrap.labeling_table .table_list table tbody tr td:nth-of-type(1) > div > div {
  position: relative;
}
.task_page .table_list_wrap.labeling_table .table_list table tbody tr td:nth-of-type(1) > div > div button {
  font-size: 20px;
  color: #666666;
}
.task_page .table_list_wrap.labeling_table .table_list table tbody tr td:nth-of-type(1) > div > div button.delete {
  color: #E44242;
}
.task_page .table_list_wrap.labeling_table .table_list table tbody tr td:nth-of-type(2) > div {
  display: flex;
  align-items: center;
  justify-content: center;
}
.task_page .table_list_wrap.labeling_table .table_list table tbody tr td:nth-of-type(2) > div > div {
  border-radius: 50%;
  width: 16px;
  height: 16px;
  background-color: #FFFFFF;
  margin-right: 4px;
}
.task_page .table_list_wrap.labeling_table .table_list table tbody tr td:nth-of-type(2) .code {
  margin-top: 4px;
  font-size: 11px;
  color: #666666;
}
.task_page .table_list_wrap.labeling_table_view .table_list table thead tr th:nth-of-type(1) {
  width: 30%;
}
.task_page .table_list_wrap.labeling_table_view .table_list table thead tr th:nth-of-type(2) {
  width: 50%;
}
.task_page .table_list_wrap.labeling_table_view .table_list table thead tr th:nth-of-type(3) {
  width: 20%;
}
.task_page .table_list_wrap.labeling_table_view .table_list table tbody tr td:nth-of-type(1) > div {
  display: flex;
  align-items: center;
  justify-content: center;
}
.task_page .table_list_wrap.labeling_table_view .table_list table tbody tr td:nth-of-type(1) > div > div {
  border-radius: 50%;
  width: 16px;
  height: 16px;
  background-color: #FFFFFF;
  margin-right: 4px;
}
.task_page .table_list_wrap.labeling_table_view .table_list table tbody tr td:nth-of-type(1) .code {
  margin-top: 4px;
  font-size: 11px;
  color: #666666;
}
.task_page .download_csv_area,
.task_page .download_pdf_area {
  font-size: 12px;
  position: relative;
  display: flex;
  justify-content: flex-end;
}
.task_page .download_csv_area button,
.task_page .download_pdf_area button {
  display: inline-block;
  border: 1px solid #4472ba;
  border-radius: 4px;
  padding: 7px 16px;
}
.task_page .download_csv_area button.toggle,
.task_page .download_pdf_area button.toggle {
  align-items: center;
  background-color: rgba(68, 114, 186, 0.1);
  color: #4472BA;
  display: flex;
  gap: 4px;
}
.task_page .download_csv_area button.toggle .icon,
.task_page .download_pdf_area button.toggle .icon {
  height: 24px;
  width: 24px;
}
.task_page .download_csv_area button.toggle svg g,
.task_page .download_pdf_area button.toggle svg g {
  fill: #4472BA;
}
.task_page .download_csv_area button.toggle:hover,
.task_page .download_pdf_area button.toggle:hover {
  color: #FFFFFF;
  background-color: #4472BA;
}
.task_page .download_csv_area button.toggle:hover svg g,
.task_page .download_pdf_area button.toggle:hover svg g {
  fill: #FFFFFF;
}
.task_page .download_csv_area button.download,
.task_page .download_pdf_area button.download {
  color: #656E73;
  background-color: #FFFFFF;
}
.task_page .download_csv_area button.download:hover,
.task_page .download_pdf_area button.download:hover {
  color: #FFFFFF;
  background-color: #656E73;
}
.task_page .download_csv_area .download_csv_modal,
.task_page .download_pdf_area .download_csv_modal {
  display: block;
  background-color: #FFFFFF;
  position: absolute;
  top: 50px;
  right: 0;
  z-index: 2050;
  text-align: left;
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  box-shadow: 0px 0px 3px #CCCCCC;
  width: max-content;
}
.task_page .download_csv_area .download_csv_modal.none,
.task_page .download_pdf_area .download_csv_modal.none {
  display: none;
}
.task_page .download_csv_area .download_csv_modal .modal_title,
.task_page .download_pdf_area .download_csv_modal .modal_title {
  padding: 16px;
  border-bottom: 1px solid #CCCCCC;
}
.task_page .download_csv_area .download_csv_modal .detail,
.task_page .download_pdf_area .download_csv_modal .detail {
  padding: 16px;
}
.task_page .download_csv_area .download_csv_modal .detail .button_area,
.task_page .download_pdf_area .download_csv_modal .detail .button_area {
  display: flex;
  justify-content: space-between;
}
.task_page .download_csv_area .download_csv_modal .detail .button_area button,
.task_page .download_pdf_area .download_csv_modal .detail .button_area button {
  margin-right: 16px;
}
.task_page .download_csv_area .download_csv_modal .detail .button_area button:last-of-type,
.task_page .download_pdf_area .download_csv_modal .detail .button_area button:last-of-type {
  margin-right: 0;
}
.task_page .download_csv_area .download_csv_modal .detail .comment,
.task_page .download_pdf_area .download_csv_modal .detail .comment {
  margin: 16px 0 0 0;
  color: #A8AFB4;
  font-size: 12px;
}
.task_page .modal_body {
  padding: 32px;
  max-height: none;
  overflow: unset;
}
.task_page .modal_body .modal-title {
  font-size: 24px;
  margin-bottom: 24px;
}
.task_page .modal_body .modal-body {
  text-align: center;
}
.task_page .modal_body .description {
  color: #666666;
}
.task_page .modal_body .item {
  margin-bottom: 16px;
}
.task_page .modal_body .item .title {
  margin-bottom: 8px;
  font-weight: bold;
  display: flex;
  align-items: center;
  min-height: 30px;
}
.task_page .modal_body .item .title .annotation {
  font-size: 12px;
  font-weight: normal;
  color: #FF0000;
  margin: 0;
}
.task_page .modal_body .item .title .annotation::before {
  content: "※";
  margin-right: 4px;
}
.task_page .modal_body .item .title .required {
  border: 1px solid #c61616;
  border-radius: 4px;
  padding: 2px 4px;
  font-size: 10px;
  color: #c61616;
}
.task_page .modal_body .item .item_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.task_page .modal_body .item .item_header .title {
  margin-bottom: 0;
}
.task_page .modal_body .item .detail {
  min-height: 34px;
}
.task_page .modal_body .item .detail input[type=text],
.task_page .modal_body .item .detail input[type=number],
.task_page .modal_body .item .detail select {
  height: auto;
  padding: 16px;
  background-color: #FFFFFF;
  border: solid 1px #CCCCCC;
  border-radius: 4px;
  font-size: 14px;
}
.task_page .modal_body .item .detail input[type=text]:focus,
.task_page .modal_body .item .detail input[type=number]:focus,
.task_page .modal_body .item .detail select:focus {
  outline: none;
}
.task_page .modal_body .item .detail input[type=text]:disabled,
.task_page .modal_body .item .detail input[type=number]:disabled,
.task_page .modal_body .item .detail select:disabled {
  background-color: #EEEEEE;
}
.task_page .modal_body .item .detail input[type=text]:focus,
.task_page .modal_body .item .detail input[type=number]:focus {
  border: 1px solid #d8e3f4;
  background-color: #FFFFFF;
  padding: 16px;
}
.task_page .modal_body .item .detail input[type=checkbox],
.task_page .modal_body .item .detail input[type=radio] {
  margin-right: 4px;
}
.task_page .modal_body .item .detail label {
  margin-bottom: 0;
}
.task_page .modal_body .item .detail label + label {
  margin-left: 8px;
}
.task_page .modal_body .item .detail + .detail {
  margin-top: 12px;
}
.task_page .modal_body .item .detail .icon {
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.task_page .modal_body .item .detail.equal_space {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.task_page .modal_body .item .detail .color_area {
  position: relative;
}
.task_page .modal_body .item .detail .color_area button {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px;
  border: 1px solid #cccccc;
  border-radius: 4px;
}
.task_page .modal_body .item .detail .color_area button .color {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: #FFFFFF;
}
.task_page .modal_body .item .detail .color_area button:disabled {
  background-color: #EEEEEE;
  color: #999999;
  cursor: not-allowed;
}
.task_page .modal_body .item .detail .color_area .search_box {
  top: 56px;
  right: unset;
  border: 1px solid #cccccc;
  color: #666666;
}
.task_page .modal_body .item .detail .color_area .search_box .color_title {
  border-bottom: 1px solid #cccccc;
  margin-bottom: 4px;
  padding: 2px;
}
.task_page .modal_body .item .detail .color_area .search_box .color_list {
  display: flex;
  gap: 16px;
  margin-bottom: 8px;
  padding: 8px;
}
.task_page .modal_body .item .detail .color_area .search_box .color_list > div {
  position: relative;
}
.task_page .modal_body .item .detail .color_area .search_box .color_list > div .color {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: #FFFFFF;
  cursor: pointer;
}
.task_page .modal_body .item .detail .project_category_area {
  position: relative;
  width: 100%;
}
.task_page .modal_body .item .detail .project_category_area button.select_area {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  width: 100%;
}
.task_page .modal_body .item .detail .project_category_area .search_box {
  top: 56px;
  right: unset;
  border: 1px solid #cccccc;
  color: #666666;
}
.task_page .modal_body .item .detail.labeling_field {
  gap: 8px;
  border: 1px solid #cccccc;
  border-radius: 4px;
}
.task_page .modal_body .item .detail.labeling_field input[type=text] {
  border: none;
}
.task_page .modal_body .item .detail.labeling_field .button_area {
  position: relative;
  white-space: nowrap;
  margin-right: 8px;
}
.task_page .modal_body .item .detail.labeling_field .button_area .add_label {
  border-radius: 5px;
  padding: 4px 8px;
  display: inline-block;
  margin-right: 8px;
  cursor: pointer;
  position: relative;
  background-color: #e44242;
  color: #ffffff;
  font-size: 10px;
}
.task_page .modal_body .item .detail.labeling_field .button_area .label {
  border-radius: 20px;
  font-size: 10px;
  padding: 6px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
  pointer-events: initial;
  cursor: default;
  background-color: #eeeeee;
}
.task_page .modal_body .item .detail.labeling_field .button_area .label .delete {
  cursor: pointer;
}
.task_page .modal_body .item .detail.labeling_field .button_area .search_box {
  border: 1px solid #cccccc;
  color: #666666;
  left: 0px;
  right: unset;
  top: 30px;
}
.task_page .modal_body .item .detail.labeling_field .button_area .search_box .search_detail {
  width: 300px;
}
.task_page .modal_body .item .textarea {
  width: 100%;
}
.task_page .modal_body .item .textarea:focus {
  outline: none;
}
.task_page .modal_body .item .keyword_input {
  width: 100%;
  border: none;
  flex: 1;
}
.task_page .modal_body .item .keyword_input:focus {
  outline: none;
}
.task_page .modal_body .item .select_search {
  width: 100%;
  position: relative;
}
.task_page .modal_body .item .select_search input[type=text] {
  z-index: 2002;
  position: relative;
}
.task_page .modal_body .item .select_search .select_list {
  border: 1px solid #cccccc;
  border-radius: 2px;
  position: absolute;
  width: 100%;
  background-color: #f4f4f4;
  z-index: 2004;
  max-height: 200px;
  overflow-y: scroll;
  box-shadow: 0px 3px 5px #cccccc;
}
.task_page .modal_body .item .select_search .select_list > div {
  padding: 12px 16px;
  cursor: pointer;
}
.task_page .modal_body .item .select_search .select_list > div:hover {
  background-color: #ededed;
}
.task_page .modal_body .item .select_search .reset {
  display: inline-flex;
  position: absolute;
  top: 50%;
  right: 0;
  font-size: 16px;
  border: none;
  background-color: transparent;
  color: #CCCCCC;
  transform: translateY(-50%);
  z-index: 2002;
}
.task_page .modal_body .item .select_search .reset:hover {
  color: #333333;
}
.task_page .modal_body .item .select_search .reset:focus {
  outline: none;
}
.task_page .modal_body .header_area {
  text-align: center;
  font-weight: bold;
  margin-bottom: 16px;
  color: #333333;
}
.task_page .modal_body .header_area .text_area {
  text-align: center;
  display: inline-block;
}
.task_page .modal_body .header_area .text_area > div {
  margin-bottom: 8px;
}
.task_page .modal_body .header_area .text_area > div span.strong {
  font-size: 20px;
  padding: 0px 4px;
}
.task_page .modal_body .header_area .text_area > div:last-of-type {
  margin-bottom: 0;
}
.task_page .edit_target_application .detail .select_area {
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  padding: 16px;
  display: flex;
}
.task_page .edit_target_application .detail .select_area .label_tip {
  border: 1px solid #CCCCCC;
  border-radius: 20px;
  padding: 4px 8px;
  display: flex;
  gap: 4px;
  align-items: center;
}
.task_page .edit_target_application .detail .select_area_list {
  position: absolute;
  z-index: 2003;
  width: 100%;
  padding: 16px;
  background-color: #FFFFFF;
  border: 1px solid #CCCCCC;
  border-radius: 4px;
}
.task_page .edit_target_application .detail .select_area_list .search_text_area {
  margin-bottom: 12px;
}
.task_page .edit_target_application .detail .select_area_list .search_text_area input[type=text] {
  padding: 8px;
  font-size: 10px;
}
.task_page .edit_target_application .detail .select_area_list .search_text_area button.reset {
  position: absolute;
  right: 20px;
  top: 22px;
  font-size: 14px;
  padding: 0px;
  color: #999999;
}
.task_page .edit_target_application .detail .select_area_list .app_list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  max-height: 300px;
  overflow-y: scroll;
}
.task_page .edit_target_application .detail .select_area_list .app_list .app_tip {
  display: flex;
  align-items: center;
  gap: 4px;
  border: 1px solid #cccccc;
  border-radius: 20px;
  padding: 4px 8px;
  background-color: #FFFFFF;
  cursor: pointer;
}
.task_page .edit_target_application .detail .select_area_list .app_list .app_tip:hover {
  background-color: #EEEEEE;
}
.task_page .edit_target_application .detail .select_area_list .app_list .no_date {
  font-size: 14px;
  font-weight: bold;
  color: #999999;
  margin: auto;
}
.task_page .edit_target_application .suggest_list {
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
  display: flex;
  flex-flow: column;
  gap: 4px;
  position: absolute;
  background-color: #ffffff;
  width: 100%;
  z-index: 1;
  max-height: 200px;
  overflow-y: scroll;
}
.task_page .edit_target_application .suggest_list .list_detail {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 8px;
  cursor: pointer;
}
.task_page .edit_target_application .suggest_list .list_detail:hover {
  background-color: #EEEEEE;
}
.task_page .target_service_setting_table {
  color: #4372ba;
  text-align: center;
}
.task_page .target_service_setting_table .row_head {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
}
.task_page .target_service_setting_table .row_head > div {
  padding: 8px;
  border-bottom: 1px solid #4372ba;
}
.task_page .target_service_setting_table .row_head > div:nth-of-type(1) {
  width: 40px;
  border-bottom: none;
}
.task_page .target_service_setting_table .row_head > div:nth-of-type(2) {
  width: calc(50% - 37.3333333333px);
}
.task_page .target_service_setting_table .row_head > div:nth-of-type(3) {
  width: calc(30% - 37.3333333333px);
}
.task_page .target_service_setting_table .row_head > div:nth-of-type(4) {
  width: calc(20% - 37.3333333333px);
}
.task_page .target_service_setting_table .row {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
  font-size: 14px;
}
.task_page .target_service_setting_table .row > div {
  padding: 16px 0px;
  border-bottom: 1px solid #4372ba;
}
.task_page .target_service_setting_table .row > div:nth-of-type(1) {
  width: 40px;
  border-bottom: none;
  font-size: 26px;
  color: #E44242;
  position: relative;
  padding: 0;
}
.task_page .target_service_setting_table .row > div:nth-of-type(2) {
  width: calc(50% - 37.3333333333px);
}
.task_page .target_service_setting_table .row > div:nth-of-type(3) {
  width: calc(30% - 37.3333333333px);
}
.task_page .target_service_setting_table .row > div:nth-of-type(4) {
  width: calc(20% - 37.3333333333px);
}
.task_page .target_service_setting_table .row_foot {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
  margin-top: 16px;
}
.task_page .target_service_setting_table .row_foot > div:nth-of-type(1) {
  width: 40px;
  font-size: 26px;
  position: relative;
}
.task_page .target_service_setting_table .row_foot > div:nth-of-type(2) {
  width: calc(100% - 64px);
  padding: 8px 0px;
}
.task_page .target_service_setting_table .row_foot > div:nth-of-type(2) button {
  border: 1px dashed #4572ba;
  border-radius: 20px;
  padding: 8px;
  text-align: center;
  color: #4572ba;
  font-size: 14px;
  background-color: #f2f2f2;
  width: 100%;
}
.task_page .master_table {
  color: #4372ba;
  text-align: center;
}
.task_page .master_table .row_head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: bold;
}
.task_page .master_table .row_head > div {
  padding: 8px;
  border-bottom: 1px solid #4372ba;
}
.task_page .master_table .row_head > div:nth-of-type(1) {
  width: 70px;
  border-bottom: none;
}
.task_page .master_table .row_head > div:nth-of-type(2) {
  width: calc(40% - 25.5px);
}
.task_page .master_table .row_head > div:nth-of-type(3) {
  width: calc(15% - 25.5px);
}
.task_page .master_table .row_head > div:nth-of-type(4) {
  width: calc(25% - 25.5px);
}
.task_page .master_table .row_head > div:nth-of-type(5) {
  width: calc(20% - 25.5px);
}
.task_page .master_table .row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: bold;
  font-size: 14px;
}
.task_page .master_table .row > div {
  padding: 16px 0px;
  border-bottom: 1px solid #4372ba;
}
.task_page .master_table .row > div:nth-of-type(1) {
  width: 70px;
  border-bottom: none;
  font-size: 26px;
  position: relative;
  padding: 0;
  display: flex;
  justify-content: space-around;
}
.task_page .master_table .row > div:nth-of-type(1) > div {
  position: relative;
}
.task_page .master_table .row > div:nth-of-type(1) > div:nth-of-type(1) {
  color: #666666;
}
.task_page .master_table .row > div:nth-of-type(1) > div:nth-of-type(2) {
  color: #E44242;
}
.task_page .master_table .row > div:nth-of-type(2) {
  width: calc(40% - 25.5px);
  display: flex;
  justify-content: center;
  gap: 4px;
}
.task_page .master_table .row > div:nth-of-type(3) {
  width: calc(15% - 25.5px);
}
.task_page .master_table .row > div:nth-of-type(4) {
  width: calc(25% - 25.5px);
}
.task_page .master_table .row > div:nth-of-type(5) {
  width: calc(20% - 25.5px);
}
.task_page .master_table .row > div .color {
  border-radius: 50%;
  width: 16px;
  height: 16px;
  background-color: #FFFFFF;
  margin-right: 4px;
}
.task_page .master_table .row_foot {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
  margin-top: 16px;
}
.task_page .master_table .row_foot > div:nth-of-type(1) {
  width: 70px;
  font-size: 26px;
  position: relative;
}
.task_page .master_table .row_foot > div:nth-of-type(2) {
  width: calc(100% - 94px);
  padding: 8px 0px;
}
.task_page .master_table .row_foot > div:nth-of-type(2) button {
  border: 1px dashed #4572ba;
  border-radius: 20px;
  padding: 8px;
  text-align: center;
  color: #4572ba;
  font-size: 14px;
  background-color: #f2f2f2;
  width: 100%;
}
.task_page .master_table.high_volume .row_head > div:nth-of-type(2) {
  width: calc(55% - 25.5px);
}
.task_page .master_table.high_volume .row_head > div:nth-of-type(3) {
  width: calc(25% - 25.5px);
}
.task_page .master_table.high_volume .row_head > div:nth-of-type(4) {
  width: calc(20% - 25.5px);
}
.task_page .master_table.high_volume .row > div:nth-of-type(2) {
  width: calc(55% - 25.5px);
}
.task_page .master_table.high_volume .row > div:nth-of-type(3) {
  width: calc(25% - 25.5px);
}
.task_page .master_table.high_volume .row > div:nth-of-type(4) {
  width: calc(20% - 25.5px);
}
.task_page .cost_table {
  color: #4372ba;
  text-align: center;
}
.task_page .cost_table .row_head {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
}
.task_page .cost_table .row_head > div {
  padding: 8px;
  border-bottom: 1px solid #4372ba;
}
.task_page .cost_table .row_head > div:nth-of-type(1) {
  width: 40px;
  border-bottom: none;
}
.task_page .cost_table .row_head > div:nth-of-type(2) {
  width: calc(50% - 44px);
}
.task_page .cost_table .row_head > div:nth-of-type(3) {
  width: calc(50% - 44px);
}
.task_page .cost_table .row {
  display: flex;
  align-items: stretch;
  gap: 24px;
  font-weight: bold;
  font-size: 14px;
}
.task_page .cost_table .row > div {
  padding: 16px 0px;
  border-bottom: 1px solid #4372ba;
}
.task_page .cost_table .row > div:nth-of-type(1) {
  width: 40px;
  border-bottom: none;
  font-size: 26px;
  position: relative;
  padding: 0;
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.task_page .cost_table .row > div:nth-of-type(1) > div {
  position: relative;
  height: unset;
}
.task_page .cost_table .row > div:nth-of-type(1) > div:nth-of-type(1) {
  color: #666666;
}
.task_page .cost_table .row > div:nth-of-type(2) {
  width: calc(50% - 44px);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.task_page .cost_table .row > div:nth-of-type(2) .profile_icon {
  border-radius: 50%;
  width: 24px;
  height: 24px;
}
.task_page .cost_table .row > div:nth-of-type(3) {
  width: calc(50% - 44px);
  padding: 20px 0;
}
.task_page .import_member_cost .modal_title {
  margin-bottom: 24px;
  font-size: 20px;
  font-weight: bold;
}
.task_page .import_member_cost .modal_detail {
  margin-bottom: 24px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
}
.task_page .import_member_cost .modal_detail .step_title {
  font-size: 18px;
  margin-bottom: 16px;
}
.task_page .import_member_cost .modal_detail .step_detail {
  margin: 0px 8px;
}
.task_page .import_member_cost .modal_detail .step_detail .detail_text_area {
  margin-bottom: 24px;
}
.task_page .import_member_cost .modal_detail .step_detail .detail_text_area .red {
  font-size: 11px;
  color: #ff0000;
  margin-top: 4px;
}
.task_page .import_member_cost .modal_detail .step_detail .detail_button_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 24px 0px;
}
.task_page .import_member_cost .modal_detail .step_detail .detail_result_area {
  display: flex;
  flex-flow: column;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
  font-size: 14px;
  margin-bottom: 16px;
  max-height: 300px;
  overflow-y: scroll;
}
.task_page .import_member_cost .modal_detail .step_detail .detail_result_area > .result_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px;
  background-color: #ffffff;
}
.task_page .import_member_cost .modal_detail .step_detail .detail_result_area > .result_row:nth-of-type(2n) {
  background-color: #eeeeee;
}
.task_page .import_member_cost .modal_detail .step_detail .detail_result_area > .result_row .cost_area {
  display: flex;
  align-items: center;
  gap: 8px;
  text-align: center;
}
.task_page .import_member_cost .modal_detail .step_detail .detail_result_area > .result_row .cost_area .display_cost {
  min-width: 100px;
}
.task_page .import_member_cost .modal_detail .upload_area {
  border: 2px dashed #666ff1;
  border-radius: 8px;
  margin: 24px 0px;
}
.task_page .import_member_cost .modal_detail .upload_area > label {
  display: flex;
  flex-flow: column;
  gap: 8px;
  color: #666ff1;
  width: 100%;
  padding: 16px;
}
.task_page .import_member_cost .modal_detail .error_message {
  text-align: center;
  padding: 8px;
  color: #ff0000;
}
.task_page .import_member_cost .button_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 8px;
}
.task_page .import_project .modal_box {
  width: 96vw;
  height: 83vh;
}
.task_page .import_project .modal_title {
  margin-bottom: 24px;
  font-size: 20px;
  font-weight: bold;
}
.task_page .import_project .modal_detail {
  margin-bottom: 24px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
  height: calc(83vh - 142px);
}
.task_page .import_project .modal_detail .step_title {
  font-size: 18px;
  margin-bottom: 16px;
}
.task_page .import_project .modal_detail .step_detail {
  margin: 0px 8px;
}
.task_page .import_project .modal_detail .step_detail .detail_text_area {
  margin-bottom: 24px;
}
.task_page .import_project .modal_detail .step_detail .detail_text_area .red {
  font-size: 11px;
  color: #ff0000;
  margin-top: 4px;
}
.task_page .import_project .modal_detail .step_detail .detail_text_area table {
  width: 100%;
  border: solid 1px #CCCCCC;
}
.task_page .import_project .modal_detail .step_detail .detail_text_area table tr > th {
  border: solid 1px #CCCCCC;
  padding: 8px;
  background-color: #EEEEEE;
  text-align: center;
}
.task_page .import_project .modal_detail .step_detail .detail_text_area table tr > td {
  border: solid 1px #CCCCCC;
  padding: 8px;
  vertical-align: middle;
}
.task_page .import_project .modal_detail .step_detail .detail_text_area table tr > td p {
  margin-bottom: 2px;
}
.task_page .import_project .modal_detail .step_detail .detail_text_area table tr > td p.required {
  color: #ff0000;
}
.task_page .import_project .modal_detail .step_detail .detail_text_area table tr > td p.example {
  background-color: #666666;
  padding: 4px;
  color: #FFF;
  margin: 4px 0;
}
.task_page .import_project .modal_detail .step_detail .detail_text_area table tr > td:nth-of-type(2) {
  text-align: center;
}
.task_page .import_project .modal_detail .step_detail .detail_button_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 24px 0px;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area {
  position: relative;
  display: flex;
  flex-flow: column;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
  font-size: 12px;
  margin-bottom: 16px;
  height: calc(83vh - 250px);
  overflow-y: scroll;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row_header {
  display: flex;
  text-align: center;
  padding: 8px 0;
  background-color: #ffffffee;
  position: sticky;
  top: 0;
  width: 100%;
  font-size: 10px;
  z-index: 1;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row_header .name_area {
  width: 25%;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row_header .schedule_area {
  width: 25%;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row_header .detail_area {
  width: 50%;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row {
  display: flex;
  align-items: center;
  padding: 8px;
  background-color: #ffffff;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row:nth-of-type(2n) {
  background-color: #F3F3F3;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row .name_area {
  width: 25%;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row .name_area .icon_color {
  background-color: #CCCCCC;
  min-width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 1px solid #FFFFFF;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row .schedule_area {
  width: 25%;
  text-align: center;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row .detail_area {
  width: 50%;
  display: flex;
  flex-flow: column;
  gap: 4px;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row .detail_area .block_area {
  border: 1px solid #CCCCCC;
  padding: 8px;
  font-size: 12px;
  background-color: #FFFFFF;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row .detail_area .block_area .title_area {
  border-bottom: dashed 1px #CCCCCC;
  margin-bottom: 8px;
  padding: 2px 4px;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row .detail_area .block_area .chip_area {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row .detail_area .block_area .chip_area .chip {
  position: relative;
  border: 1px solid #cccccc;
  border-radius: 20px;
  padding: 4px 8px;
  font-size: 10px;
  margin: 0;
}
.task_page .import_project .modal_detail .step_detail .detail_result_area > .result_row .detail_area .block_area .chip_area .chip .new {
  position: absolute;
  top: -4px;
  right: -2px;
  font-size: 7px;
  color: #FF0000;
}
.task_page .import_project .modal_detail .upload_area {
  border: 2px dashed #666ff1;
  border-radius: 8px;
  margin: 24px 0px;
}
.task_page .import_project .modal_detail .upload_area > label {
  display: flex;
  flex-flow: column;
  gap: 8px;
  color: #666ff1;
  width: 100%;
  padding: 16px;
  align-items: center;
  justify-content: center;
}
.task_page .import_project .modal_detail .error_message {
  text-align: center;
  padding: 8px;
  color: #ff0000;
  max-height: calc(90vh - 410px);
  overflow-y: scroll;
}
.task_page .import_project .button_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 8px;
  position: absolute;
  bottom: 10px;
  width: calc(96vw - 64px);
}
.task_page .import_label_master .modal_box {
  width: 1000px;
}
.task_page .import_label_master .modal_title {
  margin-bottom: 24px;
  font-size: 20px;
  font-weight: bold;
}
.task_page .import_label_master .modal_detail {
  margin-bottom: 24px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
}
.task_page .import_label_master .modal_detail .step_title {
  font-size: 18px;
  margin-bottom: 16px;
}
.task_page .import_label_master .modal_detail .step_detail {
  margin: 0px 8px;
}
.task_page .import_label_master .modal_detail .step_detail .detail_text_area {
  margin-bottom: 24px;
}
.task_page .import_label_master .modal_detail .step_detail .detail_text_area .red {
  font-size: 11px;
  color: #ff0000;
  margin-top: 4px;
}
.task_page .import_label_master .modal_detail .step_detail .detail_text_area table {
  width: 100%;
  border: solid 1px #CCCCCC;
}
.task_page .import_label_master .modal_detail .step_detail .detail_text_area table tr > th {
  border: solid 1px #CCCCCC;
  padding: 8px;
  background-color: #EEEEEE;
  text-align: center;
}
.task_page .import_label_master .modal_detail .step_detail .detail_text_area table tr > td {
  border: solid 1px #CCCCCC;
  padding: 8px;
  vertical-align: middle;
}
.task_page .import_label_master .modal_detail .step_detail .detail_text_area table tr > td p {
  margin-bottom: 2px;
}
.task_page .import_label_master .modal_detail .step_detail .detail_text_area table tr > td p.required {
  color: #ff0000;
}
.task_page .import_label_master .modal_detail .step_detail .detail_text_area table tr > td p.example {
  background-color: #666666;
  padding: 4px;
  color: #FFF;
  margin: 4px 0;
}
.task_page .import_label_master .modal_detail .step_detail .detail_text_area table tr > td:nth-of-type(2) {
  text-align: center;
}
.task_page .import_label_master .modal_detail .step_detail .detail_button_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 24px 0px;
}
.task_page .import_label_master .modal_detail .step_detail .detail_result_area {
  position: relative;
  display: flex;
  flex-flow: column;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
  font-size: 12px;
  margin-bottom: 16px;
  max-height: 300px;
  overflow-y: scroll;
}
.task_page .import_label_master .modal_detail .step_detail .detail_result_area > .result_row_header {
  display: flex;
  text-align: center;
  padding: 8px 0;
  background-color: #ffffffee;
  position: sticky;
  top: 0;
  width: 100%;
  font-size: 10px;
  z-index: 1;
}
.task_page .import_label_master .modal_detail .step_detail .detail_result_area > .result_row_header .name_area {
  width: 25%;
}
.task_page .import_label_master .modal_detail .step_detail .detail_result_area > .result_row_header .detail_area {
  width: 75%;
}
.task_page .import_label_master .modal_detail .step_detail .detail_result_area > .result_row {
  display: flex;
  align-items: center;
  padding: 8px;
  background-color: #ffffff;
}
.task_page .import_label_master .modal_detail .step_detail .detail_result_area > .result_row:nth-of-type(2n) {
  background-color: #F3F3F3;
}
.task_page .import_label_master .modal_detail .step_detail .detail_result_area > .result_row .name_area {
  width: 25%;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.task_page .import_label_master .modal_detail .step_detail .detail_result_area > .result_row .name_area .icon_color {
  background-color: #CCCCCC;
  min-width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 1px solid #FFFFFF;
}
.task_page .import_label_master .modal_detail .step_detail .detail_result_area > .result_row .detail_area {
  width: 75%;
  display: flex;
  flex-flow: column;
  gap: 4px;
}
.task_page .import_label_master .modal_detail .step_detail .detail_result_area > .result_row .detail_area .block_area {
  border: 1px solid #CCCCCC;
  padding: 8px;
  font-size: 12px;
  background-color: #FFFFFF;
}
.task_page .import_label_master .modal_detail .step_detail .detail_result_area > .result_row .detail_area .block_area .title_area {
  border-bottom: dashed 1px #CCCCCC;
  margin-bottom: 8px;
  padding: 2px 4px;
}
.task_page .import_label_master .modal_detail .upload_area {
  border: 2px dashed #666ff1;
  border-radius: 8px;
  margin: 24px 0px;
}
.task_page .import_label_master .modal_detail .upload_area > label {
  display: flex;
  flex-flow: column;
  gap: 8px;
  color: #666ff1;
  width: 100%;
  padding: 16px;
}
.task_page .import_label_master .modal_detail .error_message {
  text-align: center;
  padding: 8px;
  color: #ff0000;
}
.task_page .import_label_master .button_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 8px;
}
.task_page .permission_example {
  width: 100%;
  margin: 24px auto;
  border: 1px solid #cccccc;
  background-color: #ffffff;
}
.task_page .permission_example thead tr {
  background-color: #f8f8f8;
}
.task_page .permission_example thead tr th {
  border: 1px solid #cccccc;
  padding: 8px;
  text-align: center;
  vertical-align: middle;
  width: 11%;
}
.task_page .permission_example thead tr th:nth-of-type(1) {
  width: 30%;
}
.task_page .permission_example tbody tr td {
  border: 1px solid #cccccc;
  padding: 8px;
  text-align: center;
  vertical-align: middle;
}
.task_page .permission_example tbody tr td .label_wrapper {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}
.task_page .permission_example tbody tr td .label_wrapper .label {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  background-color: #000000;
  color: #ffffff;
  padding: 4px 8px;
  border-radius: 4px;
  width: fit-content;
}
.task_page .permission_example tbody tr td .label_wrapper .label.project_setting {
  background-color: #3a5f99;
}
.task_page .permission_example tbody tr td .label_wrapper .label.cost_view {
  background-color: #09984c;
}
.task_page .permission_example tbody tr td .label_wrapper .label.member_cost_setting {
  background-color: #988409;
}
.task_page .permission_example tbody tr td .label_wrapper .label.project_cost_setting {
  background-color: #5a11c3;
}
.task_page .permission_example tbody tr td .label_wrapper .label.attendance_export {
  background-color: #dd851f;
}
.task_page .permission_example tbody tr td .icon {
  font-size: 20px;
}
.task_page .permission_example tbody tr td .icon.green {
  color: #09984c;
}
.task_page .permission_example tbody tr td .icon.red {
  color: #FF0000;
}
.task_page .permission_table {
  color: #4372ba;
  text-align: center;
}
.task_page .permission_table .row_head {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
}
.task_page .permission_table .row_head > div {
  padding: 8px;
  border-bottom: 1px solid #4372ba;
}
.task_page .permission_table .row_head > div:nth-of-type(1) {
  width: 70px;
  border-bottom: none;
}
.task_page .permission_table .row_head > div:nth-of-type(2) {
  width: calc(40% - 59px);
}
.task_page .permission_table .row_head > div:nth-of-type(3) {
  width: calc(60% - 59px);
}
.task_page .permission_table .row {
  display: flex;
  align-items: stretch;
  gap: 24px;
  font-weight: bold;
  font-size: 14px;
}
.task_page .permission_table .row > div {
  padding: 16px 0px;
  border-bottom: 1px solid #4372ba;
}
.task_page .permission_table .row > div:nth-of-type(1) {
  width: 70px;
  border-bottom: none;
  font-size: 26px;
  position: relative;
  padding: 0;
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.task_page .permission_table .row > div:nth-of-type(1) > div {
  position: relative;
  height: unset;
}
.task_page .permission_table .row > div:nth-of-type(1) > div:nth-of-type(1) {
  color: #666666;
}
.task_page .permission_table .row > div:nth-of-type(1) > div:nth-of-type(2) {
  color: #E44242;
}
.task_page .permission_table .row > div:nth-of-type(2) {
  width: calc(40% - 59px);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.task_page .permission_table .row > div:nth-of-type(2) .profile_icon {
  border-radius: 50%;
  width: 24px;
  height: 24px;
}
.task_page .permission_table .row > div:nth-of-type(3) {
  width: calc(60% - 59px);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}
.task_page .permission_table .row > div .label {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  background-color: #000000;
  color: #ffffff;
  padding: 4px 8px;
  border-radius: 4px;
  width: fit-content;
}
.task_page .permission_table .row > div .label.project_setting {
  background-color: #3a5f99;
}
.task_page .permission_table .row > div .label.cost_view {
  background-color: #09984c;
}
.task_page .permission_table .row > div .label.member_cost_setting {
  background-color: #988409;
}
.task_page .permission_table .row > div .label.project_cost_setting {
  background-color: #5a11c3;
}
.task_page .permission_table .row > div .label.project_export {
  background-color: #1978d6;
}
.task_page .permission_table .row > div .label.attendance_export {
  background-color: #dd851f;
}
.task_page .permission_table .row_foot {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
  margin-top: 16px;
}
.task_page .permission_table .row_foot > div:nth-of-type(1) {
  width: 70px;
  font-size: 26px;
  position: relative;
}
.task_page .permission_table .row_foot > div:nth-of-type(2) {
  width: calc(100% - 94px);
  padding: 8px 0px;
}
.task_page .permission_table .row_foot > div:nth-of-type(2) button {
  border: 1px dashed #4572ba;
  border-radius: 20px;
  padding: 8px;
  text-align: center;
  color: #4572ba;
  font-size: 14px;
  background-color: #f2f2f2;
  width: 100%;
}
.task_page .exclude_table {
  color: #4372ba;
  text-align: center;
}
.task_page .exclude_table .no_data {
  padding: 40px;
  font-size: 20px;
  font-weight: bold;
}
.task_page .exclude_table .row_head {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
}
.task_page .exclude_table .row_head > div {
  padding: 8px;
  border-bottom: 1px solid #4372ba;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.task_page .exclude_table .row_head > div:nth-of-type(1) {
  width: 70px;
  border-bottom: none;
}
.task_page .exclude_table .row_head > div:nth-of-type(2) {
  width: calc(40% - 59px);
}
.task_page .exclude_table .row_head > div:nth-of-type(3) {
  width: calc(60% - 59px);
}
.task_page .exclude_table .row {
  display: flex;
  align-items: stretch;
  gap: 24px;
  font-weight: bold;
  font-size: 14px;
}
.task_page .exclude_table .row > div {
  padding: 16px 0px;
  border-bottom: 1px solid #4372ba;
}
.task_page .exclude_table .row > div:nth-of-type(1) {
  width: 70px;
  border-bottom: none;
  font-size: 26px;
  position: relative;
  padding: 0;
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.task_page .exclude_table .row > div:nth-of-type(1) > div {
  position: relative;
  height: unset;
}
.task_page .exclude_table .row > div:nth-of-type(1) > div:nth-of-type(1) {
  color: #E44242;
}
.task_page .exclude_table .row > div:nth-of-type(2) {
  width: calc(40% - 59px);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.task_page .exclude_table .row > div:nth-of-type(2) .profile_icon {
  border-radius: 50%;
  width: 24px;
  height: 24px;
}
.task_page .exclude_table .row > div:nth-of-type(3) {
  width: calc(60% - 59px);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}
.task_page .exclude_table .row_foot {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
  margin-top: 16px;
}
.task_page .exclude_table .row_foot > div:nth-of-type(1) {
  width: 70px;
  font-size: 26px;
  position: relative;
}
.task_page .exclude_table .row_foot > div:nth-of-type(2) {
  width: calc(100% - 94px);
  padding: 8px 0px;
}
.task_page .exclude_table .row_foot > div:nth-of-type(2) button {
  border: 1px dashed #4572ba;
  border-radius: 20px;
  padding: 8px;
  text-align: center;
  color: #4572ba;
  font-size: 14px;
  background-color: #f2f2f2;
  width: 100%;
}
.task_page .report_table {
  color: #4372ba;
  text-align: center;
}
.task_page .report_table .row_head {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
}
.task_page .report_table .row_head > div {
  padding: 8px;
  border-bottom: 1px solid #4372ba;
}
.task_page .report_table .row_head > div:nth-of-type(1) {
  width: 40px;
  border-bottom: none;
}
.task_page .report_table .row_head > div:nth-of-type(2) {
  width: calc(70% - 44px);
}
.task_page .report_table .row_head > div:nth-of-type(3) {
  width: calc(30% - 44px);
}
.task_page .report_table .row {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
  font-size: 14px;
}
.task_page .report_table .row > div {
  padding: 16px 0px;
  border-bottom: 1px solid #4372ba;
}
.task_page .report_table .row > div:nth-of-type(1) {
  width: 40px;
  border-bottom: none;
  font-size: 26px;
  position: relative;
  padding: 0;
  display: flex;
  justify-content: space-around;
}
.task_page .report_table .row > div:nth-of-type(1) > div {
  position: relative;
}
.task_page .report_table .row > div:nth-of-type(1) > div:nth-of-type(1) {
  color: #999999;
}
.task_page .report_table .row > div:nth-of-type(2) {
  width: calc(70% - 44px);
  display: flex;
  justify-content: center;
  gap: 8px;
}
.task_page .report_table .row > div:nth-of-type(2) .profile_icon {
  border-radius: 50%;
  width: 16px;
  height: 16px;
}
.task_page .report_table .row > div:nth-of-type(3) {
  width: calc(30% - 44px);
}
.task_page .template_table {
  color: #4372ba;
  text-align: center;
}
.task_page .template_table .row_head {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
  border-bottom: 1px solid #4372ba;
}
.task_page .template_table .row_head > div {
  padding: 8px;
}
.task_page .template_table .row_head > div:nth-of-type(1) {
  width: 70px;
  border-bottom: none;
}
.task_page .template_table .row_head > div:nth-of-type(2) {
  width: calc(30% - 59px);
}
.task_page .template_table .row_head > div:nth-of-type(3) {
  width: calc(70% - 59px);
}
.task_page .template_table .row {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
  font-size: 14px;
  border-bottom: 1px solid #4372ba;
}
.task_page .template_table .row > div {
  padding: 16px 0px;
}
.task_page .template_table .row > div:nth-of-type(1) {
  width: 70px;
  border-bottom: none;
  font-size: 26px;
  position: relative;
  padding: 0;
  display: flex;
  justify-content: space-around;
}
.task_page .template_table .row > div:nth-of-type(1) > div {
  position: relative;
}
.task_page .template_table .row > div:nth-of-type(1) > div:nth-of-type(1) {
  color: #666666;
}
.task_page .template_table .row > div:nth-of-type(1) > div:nth-of-type(2) {
  color: #E44242;
}
.task_page .template_table .row > div:nth-of-type(2) {
  width: calc(30% - 59px);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
}
.task_page .template_table .row > div:nth-of-type(3) {
  width: calc(70% - 59px);
  font-size: 12px;
  display: flex;
  flex-flow: column;
  gap: 8px;
}
.task_page .template_table .row > div:nth-of-type(3) > div {
  display: flex;
  flex-flow: column;
  gap: 8px;
  padding: 8px;
  border: 1px solid #4472ba;
  border-radius: 4px;
}
.task_page .template_table .row > div:nth-of-type(3) > div .template_detail_title {
  white-space: nowrap;
}
.task_page .template_table .row > div:nth-of-type(3) > div .template_tips {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.task_page .template_table .row > div:nth-of-type(3) > div .template_tips .template_tip {
  background-color: #eeeeee;
  padding: 4px 8px;
  border-radius: 10px;
  font-size: 10px;
  display: flex;
  align-items: center;
  gap: 4px;
  color: #666666;
}
.task_page .template_table .row > div:nth-of-type(3) > div .template_tips .template_tip .red_label {
  background-color: #ff0000;
  border-radius: 8px;
  padding: 2px 4px;
  font-size: 8px;
  height: 12px;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.task_page .template_table .row > div .color {
  border-radius: 50%;
  width: 16px;
  height: 16px;
  background-color: #FFFFFF;
}
.task_page .project_category_table {
  color: #4372ba;
  text-align: center;
}
.task_page .project_category_table .row_head {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
}
.task_page .project_category_table .row_head > div {
  padding: 8px;
  border-bottom: 1px solid #4372ba;
}
.task_page .project_category_table .row_head > div:nth-of-type(1) {
  width: 100px;
  border-bottom: none;
}
.task_page .project_category_table .row_head > div:nth-of-type(2), .task_page .project_category_table .row_head > div:nth-of-type(3) {
  width: calc(50% - 74px);
}
.task_page .project_category_table .row {
  display: flex;
  gap: 24px;
  font-weight: bold;
  font-size: 14px;
}
.task_page .project_category_table .row > div {
  padding: 16px 8px;
  border-bottom: 1px solid #4372ba;
}
.task_page .project_category_table .row > div:nth-of-type(1) {
  width: 100px;
  border-bottom: none;
  font-size: 26px;
  position: relative;
  padding: 0;
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.task_page .project_category_table .row > div:nth-of-type(1) > div {
  position: relative;
  height: auto;
}
.task_page .project_category_table .row > div:nth-of-type(1) > div.view {
  color: #4372ba;
}
.task_page .project_category_table .row > div:nth-of-type(1) > div.edit {
  color: #666666;
}
.task_page .project_category_table .row > div:nth-of-type(1) > div.delete {
  color: #E44242;
}
.task_page .project_category_table .row > div:nth-of-type(2) {
  width: calc(50% - 74px);
  display: flex;
  justify-content: left;
  align-items: center;
  gap: 8px;
  flex-flow: wrap;
}
.task_page .project_category_table .row > div:nth-of-type(3) {
  width: calc(50% - 74px);
  display: flex;
  justify-content: left;
  align-items: center;
  gap: 4px;
  flex-flow: wrap;
  font-size: 11px;
}
.task_page .project_category_table .row > div .row_name_area {
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .project_category_table .row > div .member_block {
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 20px;
  padding: 4px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .project_category_table .row > div .member_block .profile_icon {
  border-radius: 50%;
  width: 16px;
}
.task_page .project_category_table .row > div .color {
  border-radius: 50%;
  width: 16px;
  height: 16px;
  background-color: #FFFFFF;
  margin-right: 4px;
}
.task_page .no_data_area {
  text-align: center;
}
.task_page .no_data_area .no_data {
  font-size: 22px;
  color: #999999;
}
.task_page .no_data_area .no_data_button_area {
  margin-top: 24px;
}
.task_page .pie_chart_wrap .chart {
  border: 1px solid #EEEEEE;
  border-radius: 50%;
  margin: auto;
}
.task_page .pie_chart_wrap .label_area {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 16px 0px 8px;
}
.task_page .pie_chart_wrap .label_area .label {
  display: flex;
  align-items: center;
  margin: 0px 4px;
}
.task_page .pie_chart_wrap .label_area .label .label_color {
  width: 12px;
  height: 12px;
  margin-right: 4px;
}
.task_page .pie_chart_wrap .label_area .label .label_title {
  color: #666666;
}
.task_page .line_chart_wrap .horizontal .line_chart_area,
.task_page .line_chart_wrap .horizontal .bar_chart_area,
.task_page .bar_chart_wrap .horizontal .line_chart_area,
.task_page .bar_chart_wrap .horizontal .bar_chart_area {
  width: 100%;
  padding: 16px;
}
.task_page .line_chart_wrap .horizontal .line_chart_area .row,
.task_page .line_chart_wrap .horizontal .bar_chart_area .row,
.task_page .bar_chart_wrap .horizontal .line_chart_area .row,
.task_page .bar_chart_wrap .horizontal .bar_chart_area .row {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  padding: 8px 0px;
}
.task_page .line_chart_wrap .horizontal .line_chart_area .row .row_title,
.task_page .line_chart_wrap .horizontal .bar_chart_area .row .row_title,
.task_page .bar_chart_wrap .horizontal .line_chart_area .row .row_title,
.task_page .bar_chart_wrap .horizontal .bar_chart_area .row .row_title {
  width: 18%;
  padding: 0px 8px;
  text-align: right;
  margin-right: 2%;
}
.task_page .line_chart_wrap .horizontal .line_chart_area .row .row_value,
.task_page .line_chart_wrap .horizontal .bar_chart_area .row .row_value,
.task_page .bar_chart_wrap .horizontal .line_chart_area .row .row_value,
.task_page .bar_chart_wrap .horizontal .bar_chart_area .row .row_value {
  width: 80%;
  height: 40px;
  position: relative;
}
.task_page .line_chart_wrap .horizontal .line_chart_area .row .row_value .stacked_bar_chart,
.task_page .line_chart_wrap .horizontal .bar_chart_area .row .row_value .stacked_bar_chart,
.task_page .bar_chart_wrap .horizontal .line_chart_area .row .row_value .stacked_bar_chart,
.task_page .bar_chart_wrap .horizontal .bar_chart_area .row .row_value .stacked_bar_chart {
  height: 40px;
  position: relative;
  display: flex;
  align-items: center;
}
.task_page .line_chart_wrap .horizontal .line_chart_area .row .row_value .stacked_bar_chart .label,
.task_page .line_chart_wrap .horizontal .bar_chart_area .row .row_value .stacked_bar_chart .label,
.task_page .bar_chart_wrap .horizontal .line_chart_area .row .row_value .stacked_bar_chart .label,
.task_page .bar_chart_wrap .horizontal .bar_chart_area .row .row_value .stacked_bar_chart .label {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  filter: invert(100%) grayscale(100%) contrast(100);
  text-align: center;
}
.task_page .line_chart_wrap .horizontal .line_chart_area .row .row_value .stacked_bar_chart .label span,
.task_page .line_chart_wrap .horizontal .bar_chart_area .row .row_value .stacked_bar_chart .label span,
.task_page .bar_chart_wrap .horizontal .line_chart_area .row .row_value .stacked_bar_chart .label span,
.task_page .bar_chart_wrap .horizontal .bar_chart_area .row .row_value .stacked_bar_chart .label span {
  font-size: 16px;
}
.task_page .line_chart_wrap .horizontal .label_area,
.task_page .bar_chart_wrap .horizontal .label_area {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 24px 0px;
}
.task_page .line_chart_wrap .horizontal .label_area .label,
.task_page .bar_chart_wrap .horizontal .label_area .label {
  display: flex;
  align-items: center;
  margin: 0px 4px;
}
.task_page .line_chart_wrap .horizontal .label_area .label .label_color,
.task_page .bar_chart_wrap .horizontal .label_area .label .label_color {
  width: 12px;
  height: 12px;
  margin-right: 4px;
}
.task_page .line_chart_wrap .horizontal .label_area .label .label_title,
.task_page .bar_chart_wrap .horizontal .label_area .label .label_title {
  color: #666666;
}
.task_page .line_chart_wrap .vertical,
.task_page .bar_chart_wrap .vertical {
  position: relative;
}
.task_page .line_chart_wrap .vertical.ruler,
.task_page .bar_chart_wrap .vertical.ruler {
  width: calc(100% - 100px);
  margin-left: 100px;
}
.task_page .line_chart_wrap .vertical .line_chart_area,
.task_page .line_chart_wrap .vertical .bar_chart_area,
.task_page .bar_chart_wrap .vertical .line_chart_area,
.task_page .bar_chart_wrap .vertical .bar_chart_area {
  width: 100%;
  display: flex;
  margin: 16px 0 40px;
}
.task_page .line_chart_wrap .vertical .line_chart_area .abs,
.task_page .line_chart_wrap .vertical .bar_chart_area .abs,
.task_page .bar_chart_wrap .vertical .line_chart_area .abs,
.task_page .bar_chart_wrap .vertical .bar_chart_area .abs {
  position: absolute;
  height: 100%;
}
.task_page .line_chart_wrap .vertical .line_chart_area .bar,
.task_page .line_chart_wrap .vertical .bar_chart_area .bar,
.task_page .bar_chart_wrap .vertical .line_chart_area .bar,
.task_page .bar_chart_wrap .vertical .bar_chart_area .bar {
  width: 100%;
}
.task_page .line_chart_wrap .vertical .line_chart_area .bar .help,
.task_page .line_chart_wrap .vertical .bar_chart_area .bar .help,
.task_page .bar_chart_wrap .vertical .line_chart_area .bar .help,
.task_page .bar_chart_wrap .vertical .bar_chart_area .bar .help {
  height: 100%;
}
.task_page .line_chart_wrap .vertical .line_chart_area .bar .help.abs,
.task_page .line_chart_wrap .vertical .bar_chart_area .bar .help.abs,
.task_page .bar_chart_wrap .vertical .line_chart_area .bar .help.abs,
.task_page .bar_chart_wrap .vertical .bar_chart_area .bar .help.abs {
  position: absolute;
  height: auto;
}
.task_page .line_chart_wrap .vertical .line_chart_area .bar .help .tip_wrap,
.task_page .line_chart_wrap .vertical .bar_chart_area .bar .help .tip_wrap,
.task_page .bar_chart_wrap .vertical .line_chart_area .bar .help .tip_wrap,
.task_page .bar_chart_wrap .vertical .bar_chart_area .bar .help .tip_wrap {
  top: -1px;
}
.task_page .line_chart_wrap .vertical .line_chart_area .bar .help.lock .tip_wrap.none,
.task_page .line_chart_wrap .vertical .bar_chart_area .bar .help.lock .tip_wrap.none,
.task_page .bar_chart_wrap .vertical .line_chart_area .bar .help.lock .tip_wrap.none,
.task_page .bar_chart_wrap .vertical .bar_chart_area .bar .help.lock .tip_wrap.none {
  display: block;
}
.task_page .line_chart_wrap .vertical .line_chart_area .bar .help.lock .tip_wrap.hidden,
.task_page .line_chart_wrap .vertical .bar_chart_area .bar .help.lock .tip_wrap.hidden,
.task_page .bar_chart_wrap .vertical .line_chart_area .bar .help.lock .tip_wrap.hidden,
.task_page .bar_chart_wrap .vertical .bar_chart_area .bar .help.lock .tip_wrap.hidden {
  visibility: visible;
  width: auto;
}
.task_page .line_chart_wrap .vertical .line_chart_area .scale,
.task_page .line_chart_wrap .vertical .bar_chart_area .scale,
.task_page .bar_chart_wrap .vertical .line_chart_area .scale,
.task_page .bar_chart_wrap .vertical .bar_chart_area .scale {
  position: absolute;
  height: 1px;
  width: 100%;
  background-color: #eee;
  z-index: 1;
}
.task_page .line_chart_wrap .vertical .line_chart_area .column_value,
.task_page .line_chart_wrap .vertical .bar_chart_area .column_value,
.task_page .bar_chart_wrap .vertical .line_chart_area .column_value,
.task_page .bar_chart_wrap .vertical .bar_chart_area .column_value {
  position: relative;
  max-width: 140px;
  display: flex;
  align-items: end;
}
.task_page .line_chart_wrap .vertical .line_chart_area .column_value.hover:hover,
.task_page .line_chart_wrap .vertical .bar_chart_area .column_value.hover:hover,
.task_page .bar_chart_wrap .vertical .line_chart_area .column_value.hover:hover,
.task_page .bar_chart_wrap .vertical .bar_chart_area .column_value.hover:hover {
  background-color: #EEEEEE;
}
.task_page .line_chart_wrap .vertical .line_chart_area .column_value .stacked_bar_chart,
.task_page .line_chart_wrap .vertical .bar_chart_area .column_value .stacked_bar_chart,
.task_page .bar_chart_wrap .vertical .line_chart_area .column_value .stacked_bar_chart,
.task_page .bar_chart_wrap .vertical .bar_chart_area .column_value .stacked_bar_chart {
  margin: 0px auto;
  position: relative;
  z-index: 1;
}
.task_page .line_chart_wrap .vertical .line_chart_area .column_value .stacked_bar_chart .label,
.task_page .line_chart_wrap .vertical .bar_chart_area .column_value .stacked_bar_chart .label,
.task_page .bar_chart_wrap .vertical .line_chart_area .column_value .stacked_bar_chart .label,
.task_page .bar_chart_wrap .vertical .bar_chart_area .column_value .stacked_bar_chart .label {
  text-align: center;
  font-size: 12px;
  position: absolute;
  top: 0px;
  left: 50%;
  transform: translateY(-120%) translateX(-50%);
  color: #666666;
  display: flex;
  align-items: center;
  white-space: nowrap;
}
.task_page .line_chart_wrap .vertical .line_chart_area .column_value .stacked_bar_chart .label span,
.task_page .line_chart_wrap .vertical .bar_chart_area .column_value .stacked_bar_chart .label span,
.task_page .bar_chart_wrap .vertical .line_chart_area .column_value .stacked_bar_chart .label span,
.task_page .bar_chart_wrap .vertical .bar_chart_area .column_value .stacked_bar_chart .label span {
  font-size: 12px;
}
.task_page .line_chart_wrap .vertical .line_chart_area .column_value .ruler_border,
.task_page .line_chart_wrap .vertical .bar_chart_area .column_value .ruler_border,
.task_page .bar_chart_wrap .vertical .line_chart_area .column_value .ruler_border,
.task_page .bar_chart_wrap .vertical .bar_chart_area .column_value .ruler_border {
  height: 5px;
  width: 1px;
  background-color: #CCC;
  bottom: -5px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  margin: 0 auto;
}
.task_page .line_chart_wrap .vertical .line_chart_area .column_value .selected,
.task_page .line_chart_wrap .vertical .bar_chart_area .column_value .selected,
.task_page .bar_chart_wrap .vertical .line_chart_area .column_value .selected,
.task_page .bar_chart_wrap .vertical .bar_chart_area .column_value .selected {
  position: absolute;
  bottom: 0px;
  left: -12px;
  width: calc(100% + 24px);
  height: 100%;
  opacity: 1;
  background-color: #eef0f8;
  z-index: 0;
}
.task_page .line_chart_wrap .vertical .line_chart_area .column_value .selected.long,
.task_page .line_chart_wrap .vertical .bar_chart_area .column_value .selected.long,
.task_page .bar_chart_wrap .vertical .line_chart_area .column_value .selected.long,
.task_page .bar_chart_wrap .vertical .bar_chart_area .column_value .selected.long {
  bottom: 0px;
  height: 100%;
}
.task_page .line_chart_wrap .vertical .line_chart_area .column_title,
.task_page .line_chart_wrap .vertical .bar_chart_area .column_title,
.task_page .bar_chart_wrap .vertical .line_chart_area .column_title,
.task_page .bar_chart_wrap .vertical .bar_chart_area .column_title {
  position: absolute;
  bottom: 0px;
  left: 50%;
  transform: translateY(calc(100% + 10px)) translateX(-50%);
  text-align: center;
  z-index: 1;
  white-space: nowrap;
  font-size: 16px;
  font-weight: bold;
  color: #4f71b5;
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .line_chart_wrap .vertical .line_chart_area .column_title button,
.task_page .line_chart_wrap .vertical .bar_chart_area .column_title button,
.task_page .bar_chart_wrap .vertical .line_chart_area .column_title button,
.task_page .bar_chart_wrap .vertical .bar_chart_area .column_title button {
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  font-size: 10px;
  color: #999999;
  background-color: #FFFFFF;
  padding: 4px 8px;
}
.task_page .line_chart_wrap .vertical .line_chart_area .column_title button:hover,
.task_page .line_chart_wrap .vertical .bar_chart_area .column_title button:hover,
.task_page .bar_chart_wrap .vertical .line_chart_area .column_title button:hover,
.task_page .bar_chart_wrap .vertical .bar_chart_area .column_title button:hover {
  color: #FFFFFF;
  background-color: #999999;
}
.task_page .line_chart_wrap .vertical .ruler_area .horizontal_ruler_area,
.task_page .bar_chart_wrap .vertical .ruler_area .horizontal_ruler_area {
  position: absolute;
  width: 100%;
}
.task_page .line_chart_wrap .vertical .ruler_area .horizontal_ruler_area::after,
.task_page .bar_chart_wrap .vertical .ruler_area .horizontal_ruler_area::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #cccccc;
}
.task_page .line_chart_wrap .vertical .ruler_area .vertical_ruler_area,
.task_page .bar_chart_wrap .vertical .ruler_area .vertical_ruler_area {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 1px;
  height: 100%;
}
.task_page .line_chart_wrap .vertical .ruler_area .vertical_ruler_area .label_area,
.task_page .bar_chart_wrap .vertical .ruler_area .vertical_ruler_area .label_area {
  position: relative;
  height: 100%;
  width: 1px;
  background-color: #cccccc;
  margin-top: 0;
}
.task_page .line_chart_wrap .vertical .ruler_area .vertical_ruler_area .label_area .scale,
.task_page .bar_chart_wrap .vertical .ruler_area .vertical_ruler_area .label_area .scale {
  position: absolute;
  right: 0px;
  height: 1px;
  width: 10px;
  background-color: #cccccc;
}
.task_page .line_chart_wrap .vertical .ruler_area .vertical_ruler_area .label_area .label,
.task_page .bar_chart_wrap .vertical .ruler_area .vertical_ruler_area .label_area .label {
  display: flex;
  position: absolute;
  right: 12px;
  transform: translateY(-50%);
  font-size: 14px;
  color: #4572ba;
  white-space: nowrap;
  font-weight: bold !important;
}
.task_page .line_chart_wrap .vertical .label_area,
.task_page .bar_chart_wrap .vertical .label_area {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px 0px 8px;
}
.task_page .line_chart_wrap .vertical .label_area .label,
.task_page .bar_chart_wrap .vertical .label_area .label {
  display: flex;
  align-items: center;
  margin: 0px 4px;
}
.task_page .line_chart_wrap .vertical .label_area .label .label_color,
.task_page .bar_chart_wrap .vertical .label_area .label .label_color {
  width: 12px;
  height: 12px;
  margin-right: 4px;
}
.task_page .line_chart_wrap .vertical .label_area .label .label_title,
.task_page .bar_chart_wrap .vertical .label_area .label .label_title {
  color: #666666;
}
.task_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area,
.task_page .stacked_area_chart_wrap .horizontal .stacked_bar_chart_area {
  width: 100%;
  padding: 16px;
}
.task_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area .row,
.task_page .stacked_area_chart_wrap .horizontal .stacked_bar_chart_area .row {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  padding: 8px 0px;
}
.task_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area .row .row_title,
.task_page .stacked_area_chart_wrap .horizontal .stacked_bar_chart_area .row .row_title {
  width: 8%;
  padding: 0px 8px;
  text-align: right;
  margin-right: 2%;
}
.task_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area .row .row_value,
.task_page .stacked_area_chart_wrap .horizontal .stacked_bar_chart_area .row .row_value {
  height: 40px;
  position: relative;
}
.task_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area .row .row_value .stacked_bar_chart,
.task_page .stacked_area_chart_wrap .horizontal .stacked_bar_chart_area .row .row_value .stacked_bar_chart {
  height: 100%;
  position: relative;
  display: flex;
  align-items: center;
}
.task_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area .row .row_value .stacked_bar_chart .label,
.task_page .stacked_area_chart_wrap .horizontal .stacked_bar_chart_area .row .row_value .stacked_bar_chart .label {
  text-align: center;
  font-size: 12px;
  filter: invert(100%) grayscale(100%) contrast(100);
  position: absolute;
  transform: translateX(-50%);
}
.task_page .stacked_bar_chart_wrap .horizontal .stacked_bar_chart_area .row .row_value .stacked_bar_chart .label span,
.task_page .stacked_area_chart_wrap .horizontal .stacked_bar_chart_area .row .row_value .stacked_bar_chart .label span {
  font-size: 16px;
}
.task_page .stacked_bar_chart_wrap .horizontal .label_area,
.task_page .stacked_area_chart_wrap .horizontal .label_area {
  display: flex;
  align-items: center;
  justify-content: right;
  margin: 8px 0px 24px;
}
.task_page .stacked_bar_chart_wrap .horizontal .label_area .label,
.task_page .stacked_area_chart_wrap .horizontal .label_area .label {
  display: flex;
  align-items: center;
  margin: 0px 4px;
}
.task_page .stacked_bar_chart_wrap .horizontal .label_area .label .label_color,
.task_page .stacked_area_chart_wrap .horizontal .label_area .label .label_color {
  width: 12px;
  height: 12px;
  margin-right: 4px;
}
.task_page .stacked_bar_chart_wrap .horizontal .label_area .label .label_title,
.task_page .stacked_area_chart_wrap .horizontal .label_area .label .label_title {
  color: #666666;
}
.task_page .stacked_bar_chart_wrap .vertical .stacked_bar_chart_area,
.task_page .stacked_area_chart_wrap .vertical .stacked_bar_chart_area {
  width: 100%;
  display: flex;
  margin: 16px 0 22px;
}
.task_page .stacked_bar_chart_wrap .vertical .stacked_bar_chart_area .column_value,
.task_page .stacked_area_chart_wrap .vertical .stacked_bar_chart_area .column_value {
  position: relative;
  max-width: 140px;
  display: flex;
  align-items: end;
}
.task_page .stacked_bar_chart_wrap .vertical .stacked_bar_chart_area .column_value .stacked_bar_chart,
.task_page .stacked_area_chart_wrap .vertical .stacked_bar_chart_area .column_value .stacked_bar_chart {
  margin: 0px auto;
  position: relative;
}
.task_page .stacked_bar_chart_wrap .vertical .stacked_bar_chart_area .column_value .stacked_bar_chart .label,
.task_page .stacked_area_chart_wrap .vertical .stacked_bar_chart_area .column_value .stacked_bar_chart .label {
  text-align: center;
  font-size: 12px;
  filter: invert(100%) grayscale(100%) contrast(100);
  position: absolute;
  right: 0px;
  left: 0px;
  transform: translateY(-50%);
}
.task_page .stacked_bar_chart_wrap .vertical .stacked_bar_chart_area .column_value .stacked_bar_chart .label span,
.task_page .stacked_area_chart_wrap .vertical .stacked_bar_chart_area .column_value .stacked_bar_chart .label span {
  font-size: 16px;
}
.task_page .stacked_bar_chart_wrap .vertical .stacked_bar_chart_area .column_value .stacked_bar_chart .ruler_border,
.task_page .stacked_area_chart_wrap .vertical .stacked_bar_chart_area .column_value .stacked_bar_chart .ruler_border {
  height: 5px;
  width: 1px;
  background-color: #CCC;
  bottom: -5px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  margin: 0 auto;
}
.task_page .stacked_bar_chart_wrap .vertical .stacked_bar_chart_area .column_title,
.task_page .stacked_area_chart_wrap .vertical .stacked_bar_chart_area .column_title {
  position: absolute;
  bottom: 0px;
  right: 0px;
  left: 0px;
  transform: translateY(calc(100% + 10px));
  color: #666666;
  text-align: center;
}
.task_page .stacked_bar_chart_wrap .vertical .label_area,
.task_page .stacked_area_chart_wrap .vertical .label_area {
  display: flex;
  align-items: center;
  justify-content: right;
  margin: 8px 0px 24px;
}
.task_page .stacked_bar_chart_wrap .vertical .label_area .label,
.task_page .stacked_area_chart_wrap .vertical .label_area .label {
  display: flex;
  align-items: center;
  margin: 0px 4px;
}
.task_page .stacked_bar_chart_wrap .vertical .label_area .label .label_color,
.task_page .stacked_area_chart_wrap .vertical .label_area .label .label_color {
  width: 12px;
  height: 12px;
  margin-right: 4px;
}
.task_page .stacked_bar_chart_wrap .vertical .label_area .label .label_title,
.task_page .stacked_area_chart_wrap .vertical .label_area .label .label_title {
  color: #666666;
}
.task_page .stacked_bar_chart_wrap .label_area,
.task_page .stacked_area_chart_wrap .label_area {
  display: flex;
  align-items: center;
  justify-content: right;
  margin: 8px 0px 24px;
}
.task_page .stacked_bar_chart_wrap .label_area .label,
.task_page .stacked_area_chart_wrap .label_area .label {
  display: flex;
  align-items: center;
  margin: 0px 4px;
}
.task_page .stacked_bar_chart_wrap .label_area .label .label_color,
.task_page .stacked_area_chart_wrap .label_area .label .label_color {
  width: 12px;
  height: 12px;
  margin-right: 4px;
}
.task_page .stacked_bar_chart_wrap .label_area .label .label_title,
.task_page .stacked_area_chart_wrap .label_area .label .label_title {
  color: #666666;
}
.task_page .stacked_bar_chart_wrap .scale,
.task_page .stacked_area_chart_wrap .scale {
  position: absolute;
  height: 1px;
  width: 100%;
  background-color: #eee;
  z-index: 1;
}
.task_page .stacked_bar_chart_wrap .ruler_area .horizontal_ruler_area,
.task_page .stacked_area_chart_wrap .ruler_area .horizontal_ruler_area {
  position: absolute;
  width: 100%;
}
.task_page .stacked_bar_chart_wrap .ruler_area .horizontal_ruler_area::after,
.task_page .stacked_area_chart_wrap .ruler_area .horizontal_ruler_area::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #cccccc;
}
.task_page .stacked_bar_chart_wrap .ruler_area .vertical_ruler_area,
.task_page .stacked_area_chart_wrap .ruler_area .vertical_ruler_area {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 1px;
  height: 100%;
}
.task_page .stacked_bar_chart_wrap .ruler_area .vertical_ruler_area .label_area,
.task_page .stacked_area_chart_wrap .ruler_area .vertical_ruler_area .label_area {
  position: relative;
  height: calc(100% - 4px);
  width: 1px;
  background-color: #cccccc;
  margin-top: 0;
}
.task_page .stacked_bar_chart_wrap .ruler_area .vertical_ruler_area .label_area .scale,
.task_page .stacked_area_chart_wrap .ruler_area .vertical_ruler_area .label_area .scale {
  position: absolute;
  right: 0px;
  height: 1px;
  width: 10px;
  background-color: #cccccc;
}
.task_page .stacked_bar_chart_wrap .ruler_area .vertical_ruler_area .label_area .label,
.task_page .stacked_area_chart_wrap .ruler_area .vertical_ruler_area .label_area .label {
  display: flex;
  position: absolute;
  right: 12px;
  transform: translateY(-50%);
  font-size: 10px;
  color: #666666;
  white-space: nowrap;
}
.task_page .timeline_ruler_area {
  width: 83.3333333333%;
  margin-left: 16.6666666667%;
  height: 42px;
  position: relative;
}
.task_page .timeline_ruler_area div {
  width: 1px;
  height: 100%;
  position: absolute;
  transform: translateX(-50%);
  background-color: #EEEEEE;
}
.task_page .timeline_ruler_area div:nth-of-type(0) {
  left: 0%;
}
.task_page .timeline_ruler_area div:nth-of-type(1) {
  left: 4.1666666667%;
}
.task_page .timeline_ruler_area div:nth-of-type(2) {
  left: 8.3333333333%;
}
.task_page .timeline_ruler_area div:nth-of-type(3) {
  left: 12.5%;
}
.task_page .timeline_ruler_area div:nth-of-type(4) {
  left: 16.6666666667%;
}
.task_page .timeline_ruler_area div:nth-of-type(5) {
  left: 20.8333333333%;
}
.task_page .timeline_ruler_area div:nth-of-type(6) {
  left: 25%;
}
.task_page .timeline_ruler_area div:nth-of-type(7) {
  left: 29.1666666667%;
}
.task_page .timeline_ruler_area div:nth-of-type(8) {
  left: 33.3333333333%;
}
.task_page .timeline_ruler_area div:nth-of-type(9) {
  left: 37.5%;
}
.task_page .timeline_ruler_area div:nth-of-type(10) {
  left: 41.6666666667%;
}
.task_page .timeline_ruler_area div:nth-of-type(11) {
  left: 45.8333333333%;
}
.task_page .timeline_ruler_area div:nth-of-type(12) {
  left: 50%;
}
.task_page .timeline_ruler_area div:nth-of-type(13) {
  left: 54.1666666667%;
}
.task_page .timeline_ruler_area div:nth-of-type(14) {
  left: 58.3333333333%;
}
.task_page .timeline_ruler_area div:nth-of-type(15) {
  left: 62.5%;
}
.task_page .timeline_ruler_area div:nth-of-type(16) {
  left: 66.6666666667%;
}
.task_page .timeline_ruler_area div:nth-of-type(17) {
  left: 70.8333333333%;
}
.task_page .timeline_ruler_area div:nth-of-type(18) {
  left: 75%;
}
.task_page .timeline_ruler_area div:nth-of-type(19) {
  left: 79.1666666667%;
}
.task_page .timeline_ruler_area div:nth-of-type(20) {
  left: 83.3333333333%;
}
.task_page .timeline_ruler_area div:nth-of-type(21) {
  left: 87.5%;
}
.task_page .timeline_ruler_area div:nth-of-type(22) {
  left: 91.6666666667%;
}
.task_page .timeline_ruler_area div:nth-of-type(23) {
  left: 95.8333333333%;
}
.task_page .timeline {
  border: 1px solid #cccccc;
  background-color: #ffffff;
  margin-bottom: 16px;
}
.task_page .timeline::-webkit-scrollbar {
  display: none;
}
.task_page .timeline .hold {
  background-color: #ffeaea;
}
.task_page .timeline .hold .timeline_row.labeled {
  background-color: #ffeaea;
}
.task_page .timeline .hold .timeline_row.break {
  background-color: #ffeaea;
}
.task_page .timeline .hold .timeline_row.exclusion {
  background-color: #ffeaea;
}
.task_page .timeline .hold_period {
  background-color: #e3f2ff;
}
.task_page .timeline .hold_period .timeline_row.labeled {
  background-color: #e3f2ff;
}
.task_page .timeline .hold_period .timeline_row.break {
  background-color: #e3f2ff;
}
.task_page .timeline .timeline_row {
  position: relative;
  border-bottom: 1px solid #cccccc;
}
.task_page .timeline .timeline_row.new {
  background-image: repeating-linear-gradient(-60deg, #fa0000, #fa0000 3px, transparent 3px, transparent 7px, #fa0000 7px), repeating-linear-gradient(30deg, #fa0000, #fa0000 3px, transparent 3px, transparent 7px, #fa0000 7px), repeating-linear-gradient(120deg, #fa0000, #fa0000 3px, transparent 3px, transparent 7px, #fa0000 7px), repeating-linear-gradient(210deg, #fa0000, #fa0000 3px, transparent 3px, transparent 7px, #fa0000 7px);
  background-size: 1px calc(100% + 14px), calc(100% + 14px) 1px, 1px calc(100% + 14px), calc(100% + 14px) 1px;
  background-position: 0 0, 0 0, 100% 0, 0 100%;
  background-repeat: no-repeat;
  animation: borderAnimation 0.5s infinite linear;
  background-color: #fff0f0;
}
@keyframes borderAnimation {
  from {
    background-position: 0 0, -14px 0, 100% -14px, 0 100%;
  }
  to {
    background-position: 0 -14px, 0 0, 100% 0, -14px 100%;
  }
}
.task_page .timeline .timeline_row .tag {
  position: absolute;
  top: 50%;
  left: 5px;
  transform: translateY(-50%);
  font-size: 20px;
  color: #008000;
  z-index: 1;
}
.task_page .timeline .timeline_row .timeline_bar {
  position: absolute;
  top: 2px;
  height: 38px;
  background-color: #b39b2d;
}
.task_page .timeline .timeline_row .timeline_bar.not_working {
  background-color: #4570f3;
  border: none;
}
.task_page .timeline .timeline_row .timeline_bar.create {
  background-color: #e9d6ff;
  border: none;
}
.task_page .timeline .timeline_row .timeline_bar.inactive {
  background-color: #b39b2d;
  border: none;
}
.task_page .timeline .timeline_row .timeline_bar.other {
  background-color: rgba(200, 200, 200, 0.5);
  top: 2px;
  border: none;
}
.task_page .timeline .timeline_row .timeline_bar.labeled {
  background-color: #008800;
  border: none;
}
.task_page .timeline .timeline_row .timeline_bar.duplicate {
  background-color: #b4e5e2;
}
.task_page .timeline .timeline_row .timeline_bar.force {
  background-color: #c6f0c7;
}
.task_page .timeline .timeline_row .timeline_bar.outside {
  background-color: #ff9391;
  border: none;
}
.task_page .timeline .timeline_row .timeline_bar .tip_wrap {
  top: 50%;
  left: -15px;
  z-index: 2000;
  transform: translateX(-100%) translateY(-50%);
}
.task_page .timeline .timeline_row .timeline_bar .tip_wrap .tip {
  position: relative;
  white-space: nowrap;
}
.task_page .timeline .timeline_row .timeline_bar .tip_wrap .tip::before {
  bottom: unset;
  left: unset;
  right: -12px;
  transform: rotate(-45deg) translateY(25%);
}
.task_page .timeline .timeline_row .timeline_detail {
  position: absolute;
  height: 42px;
  padding: 8px 16px;
  top: 0px;
  display: flex;
  align-items: center;
  gap: 8px;
  pointer-events: none;
}
.task_page .timeline .timeline_row .timeline_detail .name_area {
  margin-right: 8px;
}
.task_page .timeline .timeline_row .timeline_detail .name_area .input_area {
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 4px;
  pointer-events: initial;
}
.task_page .timeline .timeline_row .timeline_detail .name_area .input_area input[type=text] {
  width: 300px;
}
.task_page .timeline .timeline_row .timeline_detail .name_area .input_area input[type=text].side_open {
  width: 500px;
}
.task_page .timeline .timeline_row .timeline_detail .name_area .input_area button {
  padding: 4px;
  font-size: 12px;
  background-color: #eeeeee;
  color: #999999;
  border: 1px solid #999999;
  border-radius: 5px;
}
.task_page .timeline .timeline_row .timeline_detail .name_area .input_area button:nth-of-type(1) {
  background-color: #d5e8d4;
  color: #82b366;
  border: 1px solid #82b366;
}
.task_page .timeline .timeline_row .timeline_detail .name_area .input_area button:nth-of-type(1):disabled {
  background-color: #E6F1E5;
  color: #B4D2A4;
  border: 1px solid #B4D2A4;
  cursor: not-allowed;
}
.task_page .timeline .timeline_row .timeline_detail .name_area .display_area {
  font-size: 14px;
  display: flex;
  align-items: center;
  width: 445px;
}
.task_page .timeline .timeline_row .timeline_detail .name_area .display_area.side_open {
  width: 645px;
}
.task_page .timeline .timeline_row .timeline_detail .name_area .display_area .icon_area {
  font-size: 18px;
  margin-right: 4px;
}
.task_page .timeline .timeline_row .timeline_detail .name_area .display_area .text_area {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: initial;
  cursor: pointer;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper {
  position: relative;
  display: flex;
  align-items: center;
  gap: 4px;
  z-index: 1;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper .c_icon {
  color: #999999;
  transform: rotate(-25deg);
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper .label {
  background-color: #FFFFFF;
  border: solid 2px #747474;
  border-radius: 4px;
  font-size: 10px;
  padding: 4px 6px;
  display: flex;
  align-items: center;
  gap: 4px;
  pointer-events: initial;
  cursor: default;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper .label .delete {
  cursor: pointer;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.pending .label {
  border: dotted 1px #FF0000;
  background-color: #ffc3c361;
  padding: 2px 6px;
  z-index: 1;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.pending .label .strong {
  font-weight: bold;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.pending .label .dummy_label {
  font-weight: bold;
  background-color: #FFFFFF;
  border: solid 2px #747474;
  border-radius: 4px;
  font-size: 10px;
  padding: 4px 6px;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.pending .label .done {
  color: #04a304;
  border: solid 1px #04a304;
  background-color: #FFF;
  border-radius: 16px;
  padding: 2px 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.pending .label .done:hover {
  background-color: #ddffdc;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.pending .label .delete {
  color: #747474;
  border: solid 1px #747474;
  background-color: #FFF;
  border-radius: 16px;
  padding: 2px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.pending .label .delete:hover {
  background-color: #E3E3E3;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.pending .label .automatic {
  color: #747474;
  border: solid 1px #87CDEB;
  background-color: #FFF;
  border-radius: 16px;
  padding: 2px 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.pending .label .automatic .icon {
  color: #87CDEB;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.pending .label .automatic:hover {
  background-color: #e4f7ff;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.auto .c_icon {
  color: #03CCCC;
  transform: none;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.auto .label {
  border: solid 2px #03CCCC;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.persistence .c_icon {
  color: #87ceeb;
  transform: none;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.persistence .label {
  border: solid 2px #87ceeb;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.not_belong .c_icon {
  color: #0493b1;
  transform: none;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.not_belong .label {
  border: solid 2px #0493b1;
  background-color: #0493b1;
  color: #FFFFFF;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.break .c_icon {
  color: #e88042;
  transform: none;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.break .label {
  border: solid 2px #e88042;
  background-color: #e88042;
  color: #FFFFFF;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.not_working .c_icon {
  color: #666666;
  transform: none;
}
.task_page .timeline .timeline_row .timeline_detail .label_wrapper.not_working .label {
  border: solid 2px #666666;
  background-color: #666666;
  color: #FFFFFF;
}
.task_page .timeline .timeline_row .timeline_detail .add_label {
  border-radius: 4px;
  padding: 6px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  position: relative;
  font-size: 10px;
  background-color: #E44242;
  color: #ffffff;
  pointer-events: initial;
  margin-left: 20px;
  z-index: 1;
}
.task_page .timeline .timeline_row .timeline_detail .help {
  pointer-events: initial;
}
.task_page .timeline .timeline_row .timeline_detail .help:not(.normal) {
  height: auto;
}
.task_page .timeline .timeline_row .timeline_detail .help:not(.normal) .tip_wrap {
  left: 105%;
  top: 50%;
  transform: translateY(-50%);
  font-size: 10px;
  padding: 4px 8px;
  border: solid 1px #999999;
  color: #999;
}
.task_page .timeline .timeline_row .timeline_detail .help:not(.normal) .tip_wrap .tip::before {
  bottom: 0;
  left: -14px;
  width: 6px;
  height: 6px;
  transform: rotate(135deg) translateX(-50%);
  border-bottom: solid 1px #999999;
  border-right: solid 1px #999999;
}
.task_page .timeline .timeline_row .time_area {
  color: #666666;
  font-size: 12px;
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 4px;
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  z-index: 1;
}
.task_page .timeline .timeline_row.inactive {
  background-color: #fff5ee;
}
.task_page .timeline .timeline_row.other {
  background-color: #7b7b7b;
}
.task_page .timeline .timeline_row.other .timeline_ruler_area {
  height: 38px;
}
.task_page .timeline .timeline_row.other .timeline_detail {
  margin-left: 0;
}
.task_page .timeline .timeline_row.other .timeline_detail > div {
  margin-right: 8px;
  color: #ffffff;
  text-shadow: 1px 1px #7b7b7b, -1px -1px #7b7b7b, 1px -1px #7b7b7b, -1px 1px #7b7b7b;
  font-size: 14px;
}
.task_page .timeline .timeline_row.labeled {
  background-color: #f5fff5;
}
.task_page .timeline .timeline_row.break {
  background-color: #fff0e7;
}
.task_page .timeline .timeline_row.exclusion {
  background-color: #fff2dd;
  border: solid 1px #ff9f00;
}
.task_page .timeline.calendar {
  border: 1px solid #cccccc;
  margin: 0;
  max-height: none;
  overflow-y: unset;
  overflow-x: unset;
  margin-bottom: 16px;
}
.task_page .timeline.calendar .timeline_row {
  border: none;
}
.task_page .timeline.calendar .timeline_row .timeline_item {
  position: absolute;
  top: 2px;
  height: 34px;
  background-color: #00000011;
  cursor: pointer;
}
.task_page .timeline.calendar .timeline_row .timeline_item .guide {
  position: absolute;
  bottom: 0px;
  width: 100%;
  border-right: 1px dotted #e39090;
  border-left: 1px dotted #e39090;
  display: none;
  pointer-events: none;
}
.task_page .timeline.calendar .timeline_row .timeline_item .help {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #ffd6d6;
}
.task_page .timeline.calendar .timeline_row .timeline_item.hold, .task_page .timeline.calendar .timeline_row .timeline_item:hover {
  background-color: #e39090;
}
.task_page .timeline.calendar .timeline_row .timeline_item.hold .guide, .task_page .timeline.calendar .timeline_row .timeline_item:hover .guide {
  display: block;
}
.task_page .timeline.calendar .timeline_row .timeline_ruler_area {
  height: 38px;
}
.task_page .timeline.calendar .timeline_row .timeline_detail {
  margin-left: 0;
}
.task_page .timeline.calendar .timeline_row .timeline_detail > div {
  margin-right: 8px;
}
.task_page .timeline.untracked {
  border: 1px solid #cccccc;
  margin: 0;
  max-height: none;
  overflow-y: unset;
  overflow-x: unset;
  margin-bottom: 16px;
}
.task_page .timeline.untracked .timeline_row {
  border: none;
}
.task_page .timeline.untracked .timeline_row .announce_wrap {
  position: relative;
  pointer-events: all;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .timeline.untracked .timeline_row .announce_wrap .question {
  padding: 0;
}
.task_page .timeline.untracked .timeline_row .announce_wrap .announce {
  position: absolute;
  left: 50%;
  top: -20px;
  transform: translateY(-100%) translateX(-50%);
  background-color: #FFFFFF;
  color: #666666;
  padding: 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: initial;
  border: solid 1px #666666;
  z-index: 1999;
  white-space: nowrap;
}
.task_page .timeline.untracked .timeline_row .announce_wrap .announce::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #FFFFFF;
  position: absolute;
  bottom: -9px;
  left: 50%;
  margin: auto;
  transform: rotate(45deg) translateX(-50%);
  z-index: 0;
  border-bottom: solid 1px #666666;
  border-right: solid 1px #666666;
}
.task_page .timeline.untracked .timeline_row .announce_wrap .announce .close {
  position: absolute;
  top: -8px;
  right: -9px;
  padding: 1px 4px;
  border: solid 2px #666666;
  border-radius: 50%;
  background-color: #FFFFFF;
  cursor: pointer;
}
.task_page .timeline.untracked .timeline_row .announce_wrap .announce .close:hover {
  background-color: #999999;
  color: #FFFFFF;
}
.task_page .timeline.untracked .timeline_row .timeline_item {
  position: absolute;
  top: 2px;
  height: 34px;
  background-color: #e9d6ff;
  display: flex;
  cursor: pointer;
}
.task_page .timeline.untracked .timeline_row .timeline_item .announce_wrap {
  position: absolute;
  right: 50%;
}
.task_page .timeline.untracked .timeline_row .timeline_item:hover {
  background-color: #c69cf9;
}
.task_page .timeline.untracked .timeline_row .timeline_item:hover .guide {
  display: block;
}
.task_page .timeline.untracked .timeline_row .timeline_item.duplicate {
  background-color: #b4e5e2;
}
.task_page .timeline.untracked .timeline_row .timeline_item.duplicate:hover {
  background-color: #5cc7c0;
}
.task_page .timeline.untracked .timeline_row .timeline_item .untracked_block {
  position: relative;
}
.task_page .timeline.untracked .timeline_row .timeline_item .untracked_block .announce_wrap {
  display: none;
}
.task_page .timeline.untracked .timeline_row .timeline_item .untracked_block .announce_wrap div::selection {
  background: none;
}
.task_page .timeline.untracked .timeline_row .timeline_item .untracked_block .announce_wrap.forced {
  display: block;
}
.task_page .timeline.untracked .timeline_row .timeline_item .untracked_block:hover .announce_wrap {
  display: block;
}
.task_page .timeline.untracked .timeline_row .timeline_ruler_area {
  height: 38px;
}
.task_page .timeline.untracked .timeline_row .timeline_detail {
  margin-left: 0;
}
.task_page .timeline.untracked .timeline_row .timeline_detail > div {
  margin-right: 8px;
}
.task_page .timeline.untracked .timeline_row .timeline_legend_area {
  position: absolute;
  top: -18px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .timeline.untracked .timeline_row .timeline_legend_area .timeline_legend {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .timeline.untracked .timeline_row .timeline_legend_area .timeline_legend .legend_color {
  width: 12px;
  height: 12px;
}
.task_page .timeline.untracked .timeline_row .timeline_legend_area .timeline_legend .legend_text {
  font-size: 10px;
}
.task_page .timeline_no_data {
  margin-bottom: 24px;
  text-align: center;
  font-size: 20px;
  border: 1px solid #cccccc;
  padding: 24px;
}
.task_page .journalize .date_wrap {
  display: flex;
  flex-wrap: wrap;
}
.task_page .journalize .date_wrap .date {
  width: 14.2857142857%;
  height: 100px;
  text-align: center;
  padding: 8px 0px 4px;
  font-size: 14px;
}
.task_page .journalize .date_wrap .date .bar {
  width: 60%;
  height: 2px;
  margin: 2px auto;
  background-color: #FFFFFF;
}
.task_page .journalize .date_wrap .date.in_range {
  background-color: #4372BA;
  color: #FFFFFF !important;
}
.task_page .journalize .date_wrap .date.in_range .bar {
  background-color: #4372BA;
}
.task_page .journalize .date_wrap .date.today .bar {
  background-color: #4372BA;
}
.task_page .journalize .date_wrap .date.disable {
  opacity: 0.3;
}
.task_page .journalize .calendar {
  width: 100%;
}
.task_page .journalize .calendar tr th {
  width: 14.2857142857%;
  text-align: center;
  border: solid 1px #CCC;
  padding: 8px;
}
.task_page .journalize .calendar tr th:nth-of-type(1) {
  color: #ff0000;
  background-color: #fef5f5;
}
.task_page .journalize .calendar tr th:nth-of-type(7) {
  color: #317ab7;
  background-color: #f3f8fc;
}
.task_page .journalize .calendar tr td {
  width: 14.2857142857%;
  text-align: center;
  height: 100px;
  border: solid 1px #CCC;
  padding: 8px;
}
.task_page .journalize .calendar tr td .date {
  text-align: left;
}
.task_page .journalize .calendar tr td .date .bar {
  width: 60%;
  height: 2px;
  margin: 2px auto;
  background-color: #FFFFFF;
}
.task_page .journalize .calendar tr td .date.in_range {
  background-color: #4372BA;
  color: #FFFFFF !important;
}
.task_page .journalize .calendar tr td .date.in_range .bar {
  background-color: #4372BA;
}
.task_page .journalize .calendar tr td .date.today .bar {
  background-color: #4372BA;
}
.task_page .journalize .calendar tr td .date.disable {
  opacity: 0.3;
}
.task_page .journalize .calendar tr td .text {
  font-size: 24px;
  margin: 16px;
  color: #666666;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.task_page .journalize .calendar tr td .text .exclamation {
  color: #ff4646;
  margin-right: 8px;
}
.task_page .journalize .calendar tr td .text .value {
  font-weight: bold;
  color: #4372BA;
  text-decoration: underline;
  cursor: pointer;
}
.task_page .journalize .calendar tr td .text .value span {
  font-size: 12px;
}
.task_page .journalize .calendar tr td .text .details {
  display: none;
  color: #333333;
  font-size: 14px;
  font-weight: normal;
  position: absolute;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  padding: 8px;
  width: 300px;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  max-height: 150px;
  overflow-y: scroll;
  z-index: 1;
}
.task_page .journalize .calendar tr td .text .details .title {
  margin: 8px;
}
.task_page .journalize .calendar tr td .text .details .row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px;
  cursor: pointer;
}
.task_page .journalize .calendar tr td .text .details .row .right {
  display: flex;
  align-items: center;
}
.task_page .journalize .calendar tr td .text .details .row:hover {
  background-color: #e9ffeb;
}
.task_page .journalize .calendar tr td .text:hover .details {
  display: block;
}
.task_page .task_status_bar_wrap {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 1px;
}
.task_page .task_status_bar_wrap .task_status_bar {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  cursor: pointer;
}
.task_page .task_status_bar_wrap .task_status_bar .text {
  filter: invert(100%) grayscale(100%) contrast(100);
  white-space: nowrap;
}
.task_page .task_status_bar_wrap .task_status_bar .tip {
  position: absolute;
  min-width: 100px;
  top: 10px;
  left: 50%;
  transform: translateY(-120%) translateX(-50%);
  background-color: #ffffff;
  color: #666666;
  padding: 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: initial;
  border: 1px solid #666666;
  white-space: nowrap;
  z-index: 1;
  text-align: center;
  display: none;
}
.task_page .task_status_bar_wrap .task_status_bar .tip .title {
  font-size: 10px;
  margin-bottom: 4px;
}
.task_page .task_status_bar_wrap .task_status_bar .tip .value {
  font-size: 16px;
}
.task_page .task_status_bar_wrap .task_status_bar:hover .tip {
  display: block;
}
.task_page .task_status_exclamation {
  color: #ff4646;
  margin-right: 4px;
}
.task_page .task_status_exclamation .exclamation_tip {
  position: absolute;
  background-color: #666666;
  color: #FFFFFF;
  z-index: 2;
  padding: 8px;
  border: solid 1px #666666;
  border-radius: 4px;
  bottom: 20px;
  transform: translateX(-110px);
  width: 300px;
  text-align: left;
  display: none;
}
.task_page .task_status_exclamation:hover .exclamation_tip {
  display: block;
}
.task_page .task_status_wrap {
  display: flex;
  align-items: start;
}
.task_page .task_status_wrap > div:nth-of-type(1) {
  width: 160px;
  padding-right: 24px;
  position: relative;
}
.task_page .task_status_wrap > div:nth-of-type(1) > div {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  position: relative;
  font-size: 16px;
  font-weight: bold;
}
.task_page .task_status_wrap > div:nth-of-type(1) > div:not(:first-of-type) {
  margin-top: 10px;
  height: 30px;
  font-size: 12px;
}
.task_page .task_status_wrap > div:nth-of-type(2) {
  width: calc(100% - 400px);
}
.task_page .task_status_wrap > div:nth-of-type(2) > div:not(:first-of-type) .task_status_bar {
  margin-top: 10px;
  height: 30px;
}
.task_page .task_status_wrap > div:nth-of-type(3) {
  width: 240px;
  padding-left: 24px;
  display: flex;
  justify-content: space-between;
  position: relative;
}
.task_page .task_status_wrap > div:nth-of-type(3) button {
  width: 100%;
  border: 1px solid #999999;
  border-radius: 25px;
  box-shadow: #cccccc 0px 2px 4px;
  color: #999999;
  background-color: #FFFFFF;
  margin-top: 4px;
  text-align: center;
}
.task_page .task_status_wrap > div:nth-of-type(3) button:hover {
  color: #FFFFFF;
  background-color: #999999;
}
.task_page .task_status_wrap > div:nth-of-type(3) .modal_block {
  position: absolute;
  bottom: 110%;
  top: unset;
  left: -32px;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  width: 320px;
  padding: 8px 16px;
  z-index: 999999;
}
.task_page .task_status_wrap > div:nth-of-type(3) .modal_block.high {
  bottom: unset;
  top: 110%;
}
.task_page .task_status_wrap > div:nth-of-type(3) .modal_block .title_area {
  padding: 8px 0px 24px;
  border-bottom: 1px solid #cccccc;
  color: #666666;
  font-weight: bold;
}
.task_page .task_status_wrap > div:nth-of-type(3) .modal_block .title_area .description {
  margin-top: 8px;
  font-size: 8px;
  color: #999999;
}
.task_page .task_status_wrap > div:nth-of-type(3) .modal_block .no_data {
  color: #999999;
  padding: 16px;
}
.task_page .task_status_wrap > div:nth-of-type(3) .modal_block .row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #cccccc;
  padding: 2px 4px;
  cursor: initial;
}
.task_page .task_status_wrap > div:nth-of-type(3) .modal_block .row.clickable {
  cursor: pointer;
}
.task_page .task_status_wrap > div:nth-of-type(3) .modal_block .row.clickable:hover {
  background-color: #e6ffe2;
}
.task_page .task_status_wrap > div:nth-of-type(3) .modal_block .row .label {
  width: auto;
  padding: 4px 8px;
  font-size: 10px;
  box-shadow: none;
  margin: 0px;
  background-color: #52b241;
  color: #ffffff;
  border-radius: 15px;
  position: relative;
}
.task_page .task_status_wrap > div:nth-of-type(3) .modal_block .row .label.red {
  background-color: #FF0000;
}
.task_page .task_status_wrap > div:nth-of-type(3) .modal_block .row .label.registered {
  background-color: #999999;
  cursor: default;
}
.task_page .task_status_wrap > div:nth-of-type(3) .modal_block .row .name {
  font-size: 10px;
  font-weight: bold;
  width: 60%;
}
.task_page .task_status_wrap > div:nth-of-type(3) .modal_block .text {
  color: #52b241;
  margin: 16px 0px;
}
.task_page table.task_status_table {
  width: 100%;
  border: solid 1px #CCC;
  margin-bottom: 16px;
}
.task_page table.task_status_table td {
  vertical-align: middle;
  width: 20%;
  padding: 16px;
  text-align: center;
  position: relative;
}
.task_page table.task_status_table td:nth-child(1) {
  border: solid 1px #CCC;
}
.task_page table.task_status_table td:nth-child(2) {
  width: 60%;
}
.task_page table.task_status_table td:nth-child(2) button {
  border: 1px solid #999999;
  border-radius: 25px;
  box-shadow: #cccccc 0px 2px 4px;
  color: #999999;
  background-color: #FFFFFF;
  margin-top: 4px;
  text-align: center;
  font-size: 10px;
  padding: 4px 8px;
}
.task_page table.task_status_table td:nth-child(3) button {
  width: 200px;
  border: 1px solid #999999;
  box-shadow: #cccccc 0px 2px 4px;
  color: #999999;
  background-color: #FFFFFF;
  margin-top: 4px;
  text-align: center;
}
.task_page table.task_status_table td .modal_block {
  position: absolute;
  bottom: 110%;
  top: unset;
  right: -32px;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  width: 320px;
  padding: 8px 16px;
  z-index: 999999;
  text-align: center;
}
.task_page table.task_status_table td .modal_block.high {
  bottom: unset;
  top: 110%;
}
.task_page table.task_status_table td .modal_block .title_area {
  padding: 8px 0px 24px;
  border-bottom: 1px solid #cccccc;
  color: #666666;
  font-weight: bold;
}
.task_page table.task_status_table td .modal_block .title_area .description {
  margin-top: 8px;
  font-size: 8px;
  color: #999999;
}
.task_page table.task_status_table td .modal_block .no_data {
  color: #999999;
  padding: 16px;
}
.task_page table.task_status_table td .modal_block .row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #cccccc;
  padding: 2px 4px;
  cursor: initial;
}
.task_page table.task_status_table td .modal_block .row.clickable {
  cursor: pointer;
}
.task_page table.task_status_table td .modal_block .row.clickable:hover {
  background-color: #e6ffe2;
}
.task_page table.task_status_table td .modal_block .row .label {
  width: auto;
  padding: 4px 8px;
  font-size: 10px;
  box-shadow: none;
  margin: 0px;
  background-color: #52b241;
  color: #ffffff;
  border-radius: 15px;
  position: relative;
}
.task_page table.task_status_table td .modal_block .row .label.red {
  background-color: #FF0000;
}
.task_page table.task_status_table td .modal_block .row .label.registered {
  background-color: #999999;
  cursor: default;
}
.task_page table.task_status_table td .modal_block .row .name {
  font-size: 10px;
  font-weight: bold;
  width: 60%;
}
.task_page table.task_status_table td .modal_block .text {
  color: #52b241;
  margin: 16px 0px;
}
.task_page .untracked_modal_block {
  position: absolute;
  bottom: 40%;
  font-size: 12px;
  top: unset;
  right: 0;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  width: 350px;
  padding: 8px 16px;
  z-index: 999999;
  text-align: center;
  color: #999999;
}
.task_page .untracked_modal_block.high {
  bottom: unset;
  top: 110%;
}
.task_page .untracked_modal_block .title_area {
  padding: 8px 0px 24px;
  border-bottom: 1px solid #cccccc;
  color: #666666;
  font-weight: bold;
}
.task_page .untracked_modal_block .title_area .description {
  margin-top: 8px;
  font-size: 8px;
  color: #999999;
}
.task_page .untracked_modal_block .no_data {
  color: #999999;
  padding: 16px;
}
.task_page .untracked_modal_block .row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #cccccc;
  padding: 2px 4px;
  cursor: initial;
}
.task_page .untracked_modal_block .row.clickable {
  cursor: pointer;
}
.task_page .untracked_modal_block .row.clickable:hover {
  background-color: #e6ffe2;
}
.task_page .untracked_modal_block .row .label {
  width: auto;
  min-width: 60px;
  padding: 4px 8px;
  font-size: 10px;
  box-shadow: none;
  margin: 0px;
  background-color: #52b241;
  color: #ffffff;
  border-radius: 15px !important;
  position: relative;
}
.task_page .untracked_modal_block .row .label.red {
  background-color: #FF0000;
}
.task_page .untracked_modal_block .row .label.no_target {
  background-color: #999999;
}
.task_page .untracked_modal_block .row .label.pending {
  background-color: #999999;
  cursor: default;
}
.task_page .untracked_modal_block .row .label.not_allowed {
  background-color: #999999;
  cursor: not-allowed;
}
.task_page .untracked_modal_block .row .name {
  font-size: 10px;
  font-weight: bold;
  width: 60%;
}
.task_page .untracked_modal_block .text {
  color: #52b241;
  margin: 16px 0px;
}
.task_page .manual_task_modal_block {
  position: absolute;
  bottom: 40%;
  font-size: 12px;
  top: unset;
  right: 0;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  width: 500px;
  padding: 8px 16px;
  z-index: 999999;
  text-align: center;
  color: #666666;
}
.task_page .manual_task_modal_block.high {
  bottom: unset;
  top: 110%;
}
.task_page .manual_task_modal_block .title_area {
  padding: 8px 0px 24px;
  border-bottom: 1px solid #cccccc;
  color: #666666;
  font-weight: bold;
}
.task_page .manual_task_modal_block .no_data {
  color: #999999;
  padding: 16px;
}
.task_page .manual_task_modal_block .row_wrap {
  padding: 0px 8px;
  max-height: 300px;
  overflow-x: auto;
}
.task_page .manual_task_modal_block .row_wrap .row {
  margin-bottom: 4px;
}
.task_page .manual_task_modal_block .row_wrap .row .task_detail {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px;
  border-bottom: 1px solid #cccccc;
  flex-wrap: wrap;
  gap: 4px;
}
.task_page .manual_task_modal_block .row_wrap .row .task_detail > .detail_title {
  text-align: left;
}
.task_page .manual_task_modal_block .row_wrap .row .task_detail > .status_area {
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .manual_task_modal_block .row_wrap .row .task_detail > .status_area > .help {
  width: auto;
  padding: 0;
}
.task_page .manual_task_modal_block .row_wrap .row .task_detail > .status_area > .label {
  border-radius: 20px !important;
  background-color: #eeeeee;
  padding: 2px 8px;
  font-size: 10px;
  white-space: nowrap;
}
.task_page .manual_task_modal_block .row_wrap .row .task_detail > .status_area > .label.red {
  background-color: #e44242;
  color: #FFFFFF;
}
.task_page .manual_task_modal_block .row_wrap .row .task_detail > .status_area > .label.break {
  background-color: #e88042;
  color: #FFFFFF;
}
.task_page .manual_task_modal_block .row_wrap .row .task_detail > .status_area > .label.other {
  background-color: #0493b1;
  color: #FFFFFF;
}
.task_page .manual_task_modal_block .row_wrap .row .manual_task_area {
  padding: 0px 8px;
  background-color: #f6f6f6;
  border: 1px solid #eeeeee;
  border-top: none;
}
.task_page .manual_task_modal_block .row_wrap .row .manual_task_area > .text {
  font-size: 10px;
  padding: 4px;
  color: #999999;
}
.task_page .manual_task_modal_block .row_wrap .row .manual_task_area .manual_task_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px;
}
.task_page .manual_task_modal_block .row_wrap .row .manual_task_area .manual_task_row > .detail {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .manual_task_modal_block .row_wrap .row .manual_task_area .manual_task_row > .detail .icon_area {
  font-size: 14px;
}
.task_page .fake_table {
  width: 100%;
}
.task_page .fake_table .fake_table_row {
  display: flex;
  width: 100%;
  margin-top: -1px;
}
.task_page .fake_table .fake_table_row .fake_table_cell {
  width: 100%;
  padding: 16px 8px;
  text-align: center;
  word-break: break-all;
  border: 1px solid #cccccc;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
}
.task_page .fake_table .fake_table_row .fake_table_cell:not(:last-child) {
  border-right: none;
}
.task_page .fake_table .fake_table_row.table_header {
  background-color: #eeeeee;
}
.task_page .fake_table .expand_area {
  border: 1px solid #cccccc;
  padding: 16px;
  margin-top: -1px;
}
.task_page .pagination {
  display: flex;
  justify-content: center;
  margin-top: 16px;
}
.task_page .pagination .page {
  padding: 4px 8px;
  cursor: pointer;
  margin: 0px 4px;
  min-width: 42px;
  text-align: center;
  color: #666666;
  display: flex;
  align-items: center;
}
.task_page .pagination .page:hover {
  color: #333333;
}
.task_page .pagination .page.selected {
  color: #0041f3;
  font-size: 16px;
  font-weight: bold;
}
.task_page .pagination .page.disabled {
  color: #CCCCCC;
  cursor: not-allowed;
}
.task_page .labeling_header {
  display: flex;
  justify-content: space-between;
  align-items: end;
  margin-bottom: 40px;
}
.task_page .labeling_header .labeling_summary {
  font-size: 12px;
  position: relative;
  display: flex;
  gap: 24px;
}
.task_page .labeling_header .labeling_summary .icon {
  font-size: 30px;
  position: absolute;
  top: 50%;
  left: 0px;
  transform: translateY(-35%);
  color: #008000;
}
.task_page .labeling_header .labeling_summary .help .icon {
  font-size: inherit;
  position: relative;
  top: unset;
  left: unset;
  transform: unset;
  color: inherit;
}
.task_page .labeling_header .labeling_summary .summary_block {
  background-color: #666666;
  color: #FFFFFF;
  border-radius: 4px;
  padding: 8px;
  width: 160px;
}
.task_page .labeling_header .labeling_summary .numerator {
  font-size: 34px;
  font-weight: 300;
  margin-bottom: -4px;
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 4px;
}
.task_page .labeling_header .labeling_summary .numerator .seconds {
  font-size: 20px;
}
.task_page .labeling_header .labeling_summary .button_area {
  position: relative;
}
.task_page .labeling_header .labeling_summary .button_area button.reload {
  border: solid 1px #CCCCCC;
  border-radius: 4px;
  font-size: 14px;
  color: #666666;
  margin: 0;
  background-color: #FFFFFF;
}
.task_page .labeling_header .labeling_summary .button_area button.reload:hover {
  background-color: #EEEEEE;
}
.task_page .labeling_header .labeling_summary .button_area button.reload:disabled {
  color: #999999;
}
.task_page .labeling_header .labeling_summary .button_area button.reload:disabled:hover {
  background-color: #EEEEEE;
}
.task_page .labeling_header .work_time_wrapper {
  display: flex;
  flex-flow: column;
  gap: 8px;
}
.task_page .labeling_header .work_time_area {
  padding: 4px 16px;
  border-bottom: 1px solid #999999;
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .labeling_header .work_time_area .work_time_block {
  display: flex;
  gap: 8px;
  align-items: center;
}
.task_page .labeling_header .work_time_area .work_time_block .work_time_label {
  font-size: 10px;
  background-color: #2196f3;
  color: #ffffff;
  border-radius: 4px;
  padding: 2px 8px;
}
.task_page .labeling_header .work_time_area .work_time_block .work_time_value {
  font-size: 20px;
}
.task_page .labeling_header .work_time_area .work_time_block .work_time_value.min {
  font-size: 14px;
}
.task_page .labeling_header .labeling_control {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .labeling_header button {
  border: 1px solid #cccccc;
  border-radius: 5px;
  position: relative;
  font-size: 14px;
  padding: 8px 12px;
}
.task_page .labeling_header .select_wrap {
  display: inline-flex;
  align-items: center;
  position: relative;
}
.task_page .labeling_header .select_wrap::after {
  position: absolute;
  right: 15px;
  width: 10px;
  height: 7px;
  background-color: #535353;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  content: "";
  pointer-events: none;
}
.task_page .labeling_header .select_wrap select {
  appearance: none;
  height: 2.8em;
  padding: 0.4em calc(0.8em + 30px) 0.4em 0.8em;
  border: 1px solid #cccccc;
  border-radius: 3px;
  background-color: #fff;
  color: #333333;
  font-size: 1em;
  cursor: pointer;
}
.task_page .create_project {
  border: 2px dashed #4572ba;
  border-radius: 5px;
  padding: 16px;
  text-align: center;
  color: #4572ba;
  cursor: pointer;
  font-size: 14px;
  margin: 16px 0px;
}
.task_page .project_category_row {
  border-bottom: 1px dashed #cccccc;
}
.task_page .project_category_row .project_category_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 8px;
  gap: 8px;
}
.task_page .project_category_row .project_category_header > div {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.task_page .project_category_row .project_category_header > div.title .icon {
  font-size: 20px;
}
.task_page .project_category_row .project_category_header > div.title .color {
  border-radius: 50%;
  width: 16px;
  height: 16px;
}
.task_page .project_category_row .project_category_header > div.title .text {
  font-size: 14px;
}
.task_page .project_category_row .project_category_header > div.title .text .code {
  margin-top: 4px;
  font-size: 12px;
  color: #666666;
}
.task_page .project_category_row .project_category_header > div.title .completed {
  display: flex;
  align-items: center;
  margin-left: 4px;
  padding: 4px 8px;
  background-color: #008800;
  color: #ffffff;
  font-size: 10px;
}
.task_page .project_category_row .project_category_header > div.title .open_folder_button {
  border: solid 1px #999999;
  border-radius: 4px;
  padding: 2px 4px;
  font-size: 10px;
  color: #333333;
}
.task_page .project_category_row .project_category_header > div.title .open_folder_button:hover {
  opacity: 0.8;
}
.task_page .project_category_row .project_category_header > div.create_project_button {
  color: #4572ba;
  gap: 4px;
}
.task_page .project_category_row .project_category_header > div.detail {
  gap: 8px;
  flex-flow: column;
  align-items: flex-end;
}
.task_page .project_category_row .project_category_header > div.detail > div {
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .project_category_row .project_category_header > div.detail > div > div {
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .project_category_row .project_category_header > div.detail > div > div .title {
  padding: 2px 4px;
  background-color: #999999;
  color: #ffffff;
  border-radius: 4px;
}
.task_page .project_category_row .project_category_header > div.detail > div.first > div:nth-of-type(1) {
  min-width: 288px;
}
.task_page .project_category_row .project_category_header > div.detail > div.first > div:nth-of-type(2) {
  min-width: 140px;
}
.task_page .project_category_row .project_category_header > div.detail > div.second > div:nth-of-type(1) {
  min-width: 140px;
}
.task_page .project_category_row .project_category_header > div.detail > div.second > div:nth-of-type(2) {
  min-width: 140px;
}
.task_page .project_category_row .project_category_header > div.detail > div.second > div:nth-of-type(3) {
  min-width: 140px;
}
.task_page .project_category_row .project_category_header.none {
  display: none;
}
.task_page .project_category_row .project_category_row_detail {
  padding: 16px;
  border: 1px solid #cccccc;
  margin: 0px 16px 16px;
}
.task_page .project_category_row .project_category_row_detail .project_row_header {
  display: flex;
  gap: 8px;
  border-bottom: 1px solid #eeeeee;
  padding: 4px;
}
.task_page .project_category_row .project_category_row_detail .project_none {
  text-align: center;
  padding: 16px 0px 0px;
  font-size: 16px;
  font-weight: bold;
  color: #999999;
}
.task_page .project_category_row .project_detail {
  border: 1px solid #cccccc;
  padding: 16px;
  margin-bottom: 8px;
}
.task_page .project_category_row .project_detail .button_area {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.task_page .project_category_row .project_detail .button_area button {
  display: inline-block;
  text-align: center;
  min-width: 100px;
  background-color: #666666;
  border: 1px solid #666666;
  color: #ffffff;
  padding: 8px 12px;
  border-radius: 4px;
}
.task_page .project_category_row .project_detail .button_area button.complete {
  background-color: #008800;
  border: 1px solid #008800;
}
.task_page .project_category_row .project_detail .button_area button.delete {
  background-color: #E44242;
  border: 1px solid #E44242;
}
.task_page .project_category_row .project_detail .button_area button.copy {
  background-color: #FFFFFF;
  color: #666666;
}
.task_page .project_category_row .project_detail .button_area button:hover {
  opacity: 0.9;
}
.task_page .project_category_row .project_detail .team_area {
  border: 1px solid #cccccc;
  padding: 16px;
  margin: 24px 0px;
}
.task_page .project_category_row .project_detail .team_area .title {
  color: #999999;
  margin-bottom: 8px;
}
.task_page .project_category_row .project_detail .team_area .details {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.task_page .project_category_row .project_detail .team_area .details .detail {
  background-color: #dddddd;
  border-radius: 20px;
  padding: 4px 8px;
  display: inline-block;
}
.task_page .project_category_row .project_detail .team_area .details .detail .delete {
  margin-left: 4px;
  cursor: pointer;
}
.task_page .project_category_row .project_detail .add_area {
  text-align: center;
}
.task_page .project_category_row .project_detail .add_area button {
  display: inline-block;
  text-align: center;
  width: 100%;
  background-color: #4472ba;
  border: 1px solid #4472ba;
  color: #ffffff;
  padding: 12px;
  border-radius: 4px;
  cursor: pointer;
}
.task_page .project_category_row .project_detail .add_area button:disabled {
  background-color: #bbbbbb;
  border: 1px solid #bbbbbb;
  cursor: not-allowed;
}
.task_page .project_category_row .project_detail .add_button {
  background-color: #d5e8d4;
  color: #82b366;
  border-radius: 20px;
  padding: 4px 8px;
  display: inline-block;
  margin-right: 8px;
  cursor: pointer;
  position: relative;
}
.task_page .project_category_row .project_detail .add_button .search_box {
  top: 30px;
  right: unset;
  border: 1px solid #cccccc;
  color: #666666;
}
.task_page .project_category_row .project_detail .add_button .search_box .search_detail {
  width: 300px;
}
.task_page .project_category_row .project_detail.no_frame {
  border: none;
  padding: 0;
  margin-bottom: 0;
}
.task_page .project_category_row .project_detail.no_frame .button_area {
  display: none;
}
.task_page .project_row.close {
  border-bottom: 1px dashed #cccccc;
}
.task_page .project_row .project_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  padding: 16px 0px;
}
.task_page .project_row .project_header > div {
  display: flex;
  align-items: center;
}
.task_page .project_row .project_header > div.title .icon {
  font-size: 16px;
  width: 13px;
}
.task_page .project_row .project_header > div.title .color {
  width: 16px;
  height: 16px;
}
.task_page .project_row .project_header > div.title .text {
  font-size: 14px;
}
.task_page .project_row .project_header > div.title .text .sub_area {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  font-size: 12px;
  color: #666666;
}
.task_page .project_row .project_header > div.title .text .sub_area .sub_item {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .project_row .project_header > div.title .text .sub_area .sub_item .item_label {
  border-radius: 4px;
  background-color: #666666;
  color: #FFFFFF;
  padding: 2px 4px;
  font-size: 10px;
}
.task_page .project_row .project_header > div.title .completed {
  display: flex;
  align-items: center;
  margin-left: 4px;
  padding: 4px 8px;
  background-color: #008800;
  color: #ffffff;
  font-size: 10px;
}
.task_page .project_row .project_header > div.detail {
  gap: 8px;
  flex-flow: column;
  align-items: flex-end;
}
.task_page .project_row .project_header > div.detail > div {
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .project_row .project_header > div.detail > div > div {
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .project_row .project_header > div.detail > div > div .title {
  padding: 2px 4px;
  background-color: #999999;
  color: #ffffff;
  border-radius: 4px;
}
.task_page .project_row .project_header > div.detail > div.first > div:nth-of-type(1) {
  min-width: 288px;
}
.task_page .project_row .project_header > div.detail > div.first > div:nth-of-type(2) {
  min-width: 140px;
}
.task_page .project_row .project_header > div.detail > div.second > div:nth-of-type(1) {
  min-width: 140px;
}
.task_page .project_row .project_header > div.detail > div.second > div:nth-of-type(2) {
  min-width: 140px;
}
.task_page .project_row .project_header > div.detail > div.second > div:nth-of-type(3) {
  min-width: 140px;
}
.task_page .project_row .project_header.none {
  display: none;
}
.task_page .project_row .project_detail {
  border: 1px solid #cccccc;
  padding: 16px;
  margin-bottom: 8px;
}
.task_page .project_row .project_detail .button_area {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.task_page .project_row .project_detail .button_area button {
  display: inline-block;
  text-align: center;
  min-width: 100px;
  background-color: #666666;
  border: 1px solid #666666;
  color: #ffffff;
  padding: 8px 12px;
  border-radius: 4px;
}
.task_page .project_row .project_detail .button_area button.complete {
  background-color: #008800;
  border: 1px solid #008800;
}
.task_page .project_row .project_detail .button_area button.delete {
  background-color: #E44242;
  border: 1px solid #E44242;
}
.task_page .project_row .project_detail .button_area button.copy {
  background-color: #FFFFFF;
  color: #666666;
}
.task_page .project_row .project_detail .button_area button.view {
  background-color: #3773bc;
  border: 1px solid #3773bc;
}
.task_page .project_row .project_detail .button_area button:hover {
  opacity: 0.9;
}
.task_page .project_row .project_detail .team_area {
  border: 1px solid #cccccc;
  padding: 16px;
  margin: 24px 0px;
  display: flex;
  flex-flow: column;
  gap: 8px;
}
.task_page .project_row .project_detail .team_area .title {
  color: #999999;
  margin-bottom: 8px;
}
.task_page .project_row .project_detail .team_area .details {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.task_page .project_row .project_detail .team_area .details .detail {
  background-color: #dddddd;
  border-radius: 20px;
  padding: 4px 8px;
  display: inline-block;
}
.task_page .project_row .project_detail .team_area .details .detail .delete {
  margin-left: 4px;
  cursor: pointer;
}
.task_page .project_row .project_detail .add_area {
  text-align: center;
}
.task_page .project_row .project_detail .add_area button {
  display: inline-block;
  text-align: center;
  width: 100%;
  background-color: #4472ba;
  border: 1px solid #4472ba;
  color: #ffffff;
  padding: 12px;
  border-radius: 4px;
  cursor: pointer;
}
.task_page .project_row .project_detail .add_area button:disabled {
  background-color: #bbbbbb;
  border: 1px solid #bbbbbb;
  cursor: not-allowed;
}
.task_page .project_row .project_detail .add_button {
  background-color: #d5e8d4;
  color: #82b366;
  border-radius: 20px;
  padding: 4px 8px;
  display: inline-block;
  margin-right: 8px;
  cursor: pointer;
  position: relative;
}
.task_page .project_row .project_detail .add_button .search_box {
  top: 30px;
  right: unset;
  border: 1px solid #cccccc;
  color: #666666;
}
.task_page .project_row .project_detail .add_button .search_box .search_detail {
  width: 300px;
}
.task_page .project_row .project_detail.no_frame {
  border: none;
  padding: 0;
  margin-bottom: 0;
}
.task_page .project_row .project_detail.no_frame .button_area {
  display: none;
}
.task_page .project_input_area fieldset {
  border: solid 1px #999999;
  border-radius: 4px;
  padding: 24px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 24px;
  position: relative;
}
.task_page .project_input_area fieldset.no_check {
  border: none;
  padding: 0 24px 16px;
}
.task_page .project_input_area fieldset legend {
  font-size: 14px;
  font-weight: bold;
  padding: 0 8px;
  color: #666666;
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .project_input_area fieldset legend.pointer {
  cursor: pointer;
}
.task_page .project_input_area fieldset legend .check_area {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .project_input_area fieldset legend .check_title {
  font-size: 12px;
}
.task_page .project_input_area fieldset legend .required {
  background-color: #eb3333;
  border-radius: 6px;
  color: #FFFFFF;
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 100;
}
.task_page .project_input_area fieldset .legend {
  display: flex;
  align-items: center;
  gap: 8px;
  position: absolute;
  top: -8px;
  background-color: #FFFFFF;
  color: #666666;
  font-weight: bold;
  font-size: 14px;
  padding: 0 8px;
  cursor: pointer;
}
.task_page .project_input_area fieldset .legend .check_area {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: normal;
}
.task_page .project_input_area fieldset .item.w10 {
  width: calc(10% - 8px);
}
.task_page .project_input_area fieldset .item.w20 {
  width: calc(20% - 8px);
}
.task_page .project_input_area fieldset .item.w30 {
  width: calc(30% - 8px);
}
.task_page .project_input_area fieldset .item.w40 {
  width: calc(40% - 8px);
}
.task_page .project_input_area fieldset .item.w50 {
  width: calc(50% - 8px);
}
.task_page .project_input_area fieldset .item.w60 {
  width: calc(60% - 8px);
}
.task_page .project_input_area fieldset .item.w70 {
  width: calc(70% - 8px);
}
.task_page .project_input_area fieldset .item.w80 {
  width: calc(80% - 8px);
}
.task_page .project_input_area fieldset .item.w90 {
  width: calc(90% - 8px);
}
.task_page .project_input_area fieldset .item.w100 {
  width: 100%;
}
.task_page .project_input_area .item:not(:last-of-type) {
  margin-bottom: 16px;
}
.task_page .project_input_area .item .title {
  font-weight: bold;
  display: flex;
  align-items: center;
  min-height: 30px;
}
.task_page .project_input_area .item .title .required {
  background-color: #eb3333;
  border-radius: 6px;
  color: #FFFFFF;
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 100;
}
.task_page .project_input_area .item .title .annotation {
  font-size: 12px;
  font-weight: normal;
  color: #FF0000;
  margin: 0;
}
.task_page .project_input_area .item .title .annotation::before {
  content: "※";
  margin-right: 4px;
}
.task_page .project_input_area .item .item_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.task_page .project_input_area .item .item_header .title {
  margin-bottom: 0;
}
.task_page .project_input_area .item .detail {
  min-height: 50px;
}
.task_page .project_input_area .item .detail input[type=text],
.task_page .project_input_area .item .detail input[type=number],
.task_page .project_input_area .item .detail select {
  height: auto;
  width: 100%;
  padding: 16px;
  background-color: #FFFFFF;
  border: solid 1px #CCCCCC;
  border-radius: 4px;
  font-size: 14px;
}
.task_page .project_input_area .item .detail input[type=text]:focus,
.task_page .project_input_area .item .detail input[type=number]:focus,
.task_page .project_input_area .item .detail select:focus {
  outline: none;
}
.task_page .project_input_area .item .detail input[type=text]:disabled,
.task_page .project_input_area .item .detail input[type=number]:disabled,
.task_page .project_input_area .item .detail select:disabled {
  background-color: #EEEEEE;
}
.task_page .project_input_area .item .detail input[type=text]::placeholder,
.task_page .project_input_area .item .detail input[type=number]::placeholder,
.task_page .project_input_area .item .detail select::placeholder {
  color: #cccccc;
}
.task_page .project_input_area .item .detail textarea {
  resize: none;
}
.task_page .project_input_area .item .detail textarea:focus {
  outline: none;
}
.task_page .project_input_area .item .detail textarea::placeholder {
  color: #cccccc;
}
.task_page .project_input_area .item .detail input[type=text]:focus,
.task_page .project_input_area .item .detail input[type=number]:focus {
  border: 1px solid #d8e3f4;
  background-color: #FFFFFF;
  padding: 16px;
}
.task_page .project_input_area .item .detail input[type=checkbox],
.task_page .project_input_area .item .detail input[type=radio] {
  margin-right: 4px;
}
.task_page .project_input_area .item .detail label {
  margin-bottom: 0;
}
.task_page .project_input_area .item .detail label + label {
  margin-left: 8px;
}
.task_page .project_input_area .item .detail + .detail {
  margin-top: 12px;
}
.task_page .project_input_area .item .detail .icon {
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.task_page .project_input_area .item .detail.equal_space {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
.task_page .project_input_area .item .detail .color_area {
  position: relative;
  width: 100%;
}
.task_page .project_input_area .item .detail .color_area button {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 8px;
  padding: 16px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  background-color: #FFFFFF;
}
.task_page .project_input_area .item .detail .color_area button .color {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: #FFFFFF;
}
.task_page .project_input_area .item .detail .color_area .search_box {
  top: 56px;
  right: unset;
  border: 1px solid #cccccc;
  color: #666666;
}
.task_page .project_input_area .item .detail .color_area .search_box .color_title {
  border-bottom: 1px solid #cccccc;
  margin-bottom: 4px;
  padding: 2px;
}
.task_page .project_input_area .item .detail .color_area .search_box .color_list {
  display: flex;
  gap: 16px;
  margin-bottom: 8px;
  padding: 8px;
}
.task_page .project_input_area .item .detail .color_area .search_box .color_list > div {
  position: relative;
}
.task_page .project_input_area .item .detail .color_area .search_box .color_list > div .color {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: #FFFFFF;
  cursor: pointer;
}
.task_page .project_input_area .item .detail .project_category_area {
  position: relative;
  width: 100%;
}
.task_page .project_input_area .item .detail .project_category_area button.select_area {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 8px;
  padding: 16px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  background-color: #FFFFFF;
}
.task_page .project_input_area .item .detail .project_category_area .search_box {
  top: 56px;
  right: unset;
  border: 1px solid #cccccc;
  color: #666666;
}
.task_page .project_input_area .item .detail .project_category_area .search_box button.create_project_category {
  border-radius: 4px;
  width: 100%;
  text-align: center;
  margin-top: 8px;
  color: #FFFFFF;
  background-image: linear-gradient(45deg, #343bca, #a278b6 50%, #f3c4aa);
}
.task_page .project_input_area .item .detail .project_category_area .search_box button.create_project_category:hover {
  opacity: 0.8;
}
.task_page .project_input_area .item .detail .project_category_area .search_box .color_title {
  border-bottom: 1px solid #cccccc;
  margin-bottom: 4px;
  padding: 2px;
}
.task_page .project_input_area .item .detail .project_category_area .search_box .color_list {
  display: flex;
  gap: 16px;
  margin-bottom: 8px;
  padding: 8px;
}
.task_page .project_input_area .item .detail .project_category_area .search_box .color_list > div {
  position: relative;
}
.task_page .project_input_area .item .detail .project_category_area .search_box .color_list > div .color {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: #FFFFFF;
  cursor: pointer;
}
.task_page .project_input_area .item .detail .calendar_text button {
  background-color: #FFFFFF;
  color: #666666;
  border: solid 1px #CCCCCC;
  justify-content: center;
}
.task_page .project_input_area .item .detail .link {
  margin-left: 8px;
  color: #3a5f99;
  text-decoration: underline;
  cursor: pointer;
}
.task_page .project_input_area .item .detail .link:hover {
  color: #60b4f5;
}
.task_page .project_input_area .item .textarea {
  width: 100%;
}
.task_page .project_input_area .item .textarea:focus {
  outline: none;
}
.task_page .project_input_area .item .keyword_input {
  width: 100%;
  border: none;
  flex: 1;
}
.task_page .project_input_area .item .keyword_input:focus {
  outline: none;
}
.task_page .project_input_area .item .select_search {
  width: 100%;
  position: relative;
}
.task_page .project_input_area .item .select_search input[type=text] {
  z-index: 2001;
  position: relative;
}
.task_page .project_input_area .item .select_search .select_list {
  border: 1px solid #cccccc;
  border-radius: 2px;
  position: absolute;
  width: 100%;
  background-color: #ffffff;
  z-index: 2002;
  max-height: 200px;
  overflow-y: scroll;
}
.task_page .project_input_area .item .select_search .select_list > div {
  padding: 8px;
  cursor: pointer;
}
.task_page .project_input_area .item .select_search .select_list > div:hover {
  background-color: #ededed;
}
.task_page .project_input_area .item .select_search .reset {
  display: inline-flex;
  position: absolute;
  top: 50%;
  right: 0;
  font-size: 16px;
  border: none;
  background-color: transparent;
  color: #CCCCCC;
  transform: translateY(-50%);
  z-index: 2001;
}
.task_page .project_input_area .item .select_search .reset:hover {
  color: #333333;
}
.task_page .project_input_area .item .select_search .reset:focus {
  outline: none;
}
.task_page .project_input_area .item .team_area {
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 16px;
  width: 100%;
  background-color: #FFFFFF;
  display: flex;
  flex-flow: column;
  gap: 8px;
}
.task_page .project_input_area .item .team_area .chip_area {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.task_page .project_input_area .item .team_area .chip_area > .chip {
  background-color: #dddddd;
  border-radius: 20px;
  padding: 4px 8px;
  display: inline-block;
  margin: 0;
}
.task_page .project_input_area .item .team_area .chip_area > .chip .delete {
  margin-left: 4px;
  cursor: pointer;
}
.task_page .project_input_area .item .team_area .chip_area .add_button {
  background-color: #d5e8d4;
  color: #82b366;
  border-radius: 20px;
  padding: 4px 8px;
  display: inline-block;
  margin-right: 8px;
  cursor: pointer;
  position: relative;
}
.task_page .project_input_area .item .team_area .chip_area .add_button .search_box {
  top: 30px;
  right: unset;
  border: 1px solid #cccccc;
  color: #666666;
}
.task_page .project_input_area .item .team_area .chip_area .add_button .search_box .search_detail {
  width: 500px;
}
.task_page .project_input_area .item .team_area .chip_area .add_button .search_box .search_detail .icon {
  width: 14px;
  height: 14px;
}
.task_page .project_input_area .item .team_area .chip_area .add_button .search_box .search_detail input[type=text]:focus {
  border: none;
  background-color: transparent;
}
.task_page .project_input_area .item .team_area .no_select {
  margin-top: 8px;
}
.task_page .project_input_area .item .label_area {
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 8px;
  margin-top: 0;
  gap: 8px;
}
.task_page .project_input_area .item .label_area .label_select_area {
  height: auto;
  width: 100%;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 4px;
  font-size: 14px;
  position: relative;
}
.task_page .project_input_area .item .label_area .add_button {
  position: relative;
  padding: 12px 16px;
  min-height: 48px;
}
.task_page .project_input_area .item .label_area .add_button.pointer {
  cursor: pointer;
  color: #82b366;
  display: flex;
}
.task_page .project_input_area .item .label_area .add_button .editable_area {
  margin-top: 4px;
}
.task_page .project_input_area .item .label_area .add_button .editable_area input[type=text] {
  padding: 0;
  border: none;
  border-bottom: solid 1px #999999;
  border-radius: 0;
  margin: 0 4px;
  width: calc(100% - 8px);
}
.task_page .project_input_area .item .label_area .add_button .search_box {
  top: 48px;
  right: 0;
  left: 0;
  border: 1px solid #cccccc;
  color: #666666;
}
.task_page .project_input_area .item .label_area .add_button .search_box .search_detail {
  width: 100%;
}
.task_page .project_input_area .item .label_area .add_button .search_box .search_detail .icon {
  width: 14px;
  height: 14px;
}
.task_page .project_input_area .item .label_area .add_button .search_box .search_detail input[type=text]:focus {
  border: none;
  background-color: transparent;
  padding: 8px 16px;
}
.task_page .project_input_area .item .label_area .add_button .search_box .create_label_area {
  display: flex;
  gap: 8px;
  margin-bottom: 8px;
}
.task_page .project_input_area .item .label_area .add_button .search_box .create_label_area .search_area {
  margin: 0;
}
.task_page .project_input_area .item .label_area .add_button .search_box .create_label_area input[type=text] {
  padding: 8px;
}
.task_page .project_input_area .item .label_area .add_button .search_box .create_label_area input[type=text]:focus {
  padding: 8px;
}
.task_page .project_input_area .item .label_area .advanced_setting {
  width: max-content;
  white-space: nowrap;
  border-radius: 4px;
  background-color: #ffffff;
  border: 1px solid #666666;
  color: #666666;
  font-size: 12px;
  position: relative;
}
.task_page .project_input_area .item .label_area .advanced_setting:hover {
  background-color: #eeeeee;
}
.task_page .project_input_area .item .label_area .advanced_setting:disabled {
  background-color: #DDDDDD;
  color: #999999;
  border-color: #999999;
  cursor: not-allowed;
}
.task_page .project_input_area .item .add_area {
  text-align: center;
}
.task_page .project_input_area .item .add_area button {
  display: inline-block;
  text-align: center;
  width: 100%;
  background-color: #d6e8d4;
  border: 1px solid #81b365;
  color: #81b365;
  padding: 12px;
  border-radius: 4px;
  cursor: pointer;
}
.task_page .project_input_area .item .add_area button.disabled, .task_page .project_input_area .item .add_area button:disabled {
  background-color: #bbbbbb;
  border: 1px solid #bbbbbb;
  color: #FFFFFF;
  cursor: not-allowed;
}
.task_page .project_input_area .item .error {
  margin-top: 4px;
  margin-left: 8px;
  color: #C61616;
}
.task_page .project_input_area .item .comment {
  margin-top: 4px;
  margin-left: 8px;
  color: #333333;
}
.task_page .project_input_area .item .comment .strong {
  font-size: 16px;
}
.task_page .project_input_area .item .comment .strong.link {
  color: #3a5f99;
  cursor: pointer;
  text-decoration: underline;
}
.task_page .project_input_area .item .comment .strong.link:hover {
  color: #52a2c3;
}
.task_page .summary_area .summary_header {
  display: flex;
  justify-content: right;
  gap: 8px;
}
.task_page .summary_area .summary_header > div {
  border: 1px solid #4372ba;
  text-align: center;
  padding: 8px;
  color: #4372ba;
  font-weight: bold;
}
.task_page .summary_area .summary_header > div:nth-of-type(1) {
  width: calc(17% + 0.5px);
  border: none;
}
.task_page .summary_area .summary_header > div:nth-of-type(2) {
  width: 26%;
}
.task_page .summary_area .summary_header > div:nth-of-type(3) {
  width: 16%;
  background-color: #ffe5e5;
}
.task_page .summary_area .summary_header > div:nth-of-type(4) {
  width: 41%;
  background-color: #ecfdea;
}
.task_page .summary_area .summary_list .summary_row {
  display: flex;
  justify-content: right;
  gap: 8px;
  margin-top: -1px;
  margin-bottom: 32px;
  font-size: 10px;
}
.task_page .summary_area .summary_list .summary_row > div {
  text-align: center;
  color: #4372ba;
  font-weight: bold;
  display: flex;
}
.task_page .summary_area .summary_list .summary_row > div .value {
  font-size: 14px;
}
.task_page .summary_area .summary_list .summary_row > div .value.red {
  color: #FF0000;
}
.task_page .summary_area .summary_list .summary_row > div .value.small {
  font-size: 10px;
}
.task_page .summary_area .summary_list .summary_row > div .completed {
  font-size: 10px;
  color: #1ca500;
}
.task_page .summary_area .summary_list .summary_row > div .limit {
  font-size: 10px;
}
.task_page .summary_area .summary_list .summary_row > div .limit span {
  font-size: 12px;
}
.task_page .summary_area .summary_list .summary_row > div .limit.red {
  color: #FF0000;
}
.task_page .summary_area .summary_list .summary_row > div .add_area {
  position: absolute;
  bottom: -16px;
  white-space: nowrap;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(1) {
  width: 17%;
  background-color: #ffffff;
  display: block;
  border: 1px solid #4372ba;
  padding: 8px;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(1) .project_title {
  font-size: 18px;
  margin-bottom: 4px;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(1) button {
  border: 1px solid #4372ba;
  border-radius: 20px;
  padding: 0px 12px;
  display: flex;
  align-items: center;
  margin: auto;
  background-color: #ffffff;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(1) button .icon {
  font-size: 20px;
  margin-left: 8px;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(2) {
  width: 26%;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(2) > div {
  border: 1px solid #4372ba;
  margin-left: -1px;
  padding: 8px;
  display: flex;
  flex-flow: column;
  justify-content: space-around;
  align-items: center;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(2) > div:nth-of-type(1) {
  width: 40%;
  margin-left: 0;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(2) > div:nth-of-type(2) {
  width: calc(40% + 1px);
  color: #ffffff;
  background-color: #4372ba;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(2) > div:nth-of-type(3) {
  width: calc(20% + 1px);
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(3) {
  width: 16%;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(3) > div {
  border: 1px solid #4372ba;
  margin-left: -1px;
  padding: 8px;
  display: flex;
  flex-flow: column;
  justify-content: space-around;
  align-items: center;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(3) > div:nth-of-type(1) {
  width: 50%;
  margin-left: 0;
  color: #ffffff;
  background-color: #4372ba;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(3) > div:nth-of-type(2) {
  width: calc(50% + 1px);
  position: relative;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(4) {
  width: 41%;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(4) > div {
  border: 1px solid #4372ba;
  margin-left: -1px;
  padding: 8px;
  display: flex;
  flex-flow: column;
  justify-content: space-around;
  align-items: center;
  position: relative;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(4) > div:nth-of-type(1) {
  width: 25%;
  color: #ffffff;
  margin-left: 0;
  background-color: #4372ba;
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(4) > div:nth-of-type(2), .task_page .summary_area .summary_list .summary_row > div:nth-of-type(4) > div:nth-of-type(3) {
  width: calc(25% + 1px);
}
.task_page .summary_area .summary_list .summary_row > div:nth-of-type(4) > div:nth-of-type(4) {
  width: calc(25% + 1px);
  background-color: #e3eaf5;
}
.task_page .summary_area .summary_list .summary_row.completed > div {
  background-color: #eaeaea;
}
.task_page .summary_area .summary_list .summary_row.completed > div:nth-of-type(2) > div:nth-of-type(2) {
  background-color: #777777;
}
.task_page .summary_area .summary_list .summary_row.completed > div:nth-of-type(3) > div:nth-of-type(1) {
  background-color: #777777;
}
.task_page .summary_area .summary_list .summary_row.completed > div:nth-of-type(4) > div:nth-of-type(1) {
  background-color: #777777;
}
.task_page .summary_area .summary_list .summary_row.completed > div:nth-of-type(4) > div:nth-of-type(4) {
  background-color: #d1d8e3;
}
.task_page .summary_area .summary_list .summary_detail {
  border: 2px solid #4372ba;
  border-radius: 5px;
  padding: 16px;
  margin-bottom: 24px;
  background-color: #ffffff;
}
.task_page .summary_area .summary_list .summary_detail.completed {
  background-color: #eaeaea;
}
.task_page .summary_area .summary_list .summary_detail .category_title {
  font-size: 14px;
  font-weight: bold;
  color: #4472ba;
}
.task_page .summary_area table {
  width: 100%;
}
.task_page .summary_area table thead tr th {
  text-align: center;
  padding: 8px;
  border: solid 1px #4372ba;
  color: #4372ba;
}
.task_page .summary_area table thead tr th:nth-of-type(1) {
  border: none;
}
.task_page .summary_area table thead tr th:nth-of-type(3) {
  background-color: #ffe5e4;
}
.task_page .summary_area table thead tr th:nth-of-type(4) {
  background-color: #ecfde9;
}
.task_page .summary_area table tbody tr td {
  text-align: center;
  padding: 8px;
  border: solid 1px #4372ba;
  color: #4372ba;
  vertical-align: middle;
  font-size: 14px;
  font-weight: bold;
  width: 12%;
}
.task_page .summary_area table tbody tr td:nth-of-type(1) {
  width: 17%;
}
.task_page .summary_area table tbody tr td:nth-of-type(1) button {
  border: 1px solid #4372ba;
  border-radius: 20px;
  padding: 0px 12px;
  display: flex;
  align-items: center;
  margin: auto;
  background-color: #ffffff;
  font-size: 10px;
}
.task_page .summary_area table tbody tr td:nth-of-type(1) button .icon {
  font-size: 20px;
  margin-left: 8px;
}
.task_page .summary_area table tbody tr td:nth-of-type(2) {
  width: 11%;
}
.task_page .summary_area table tbody tr td:last-of-type {
  background-color: #e3eaf5;
}
.task_page .summary_area table tbody tr td.reverse {
  background-color: #4372ba;
  color: #FFFFFF;
  border: solid 1px #FFFFFF;
}
.task_page .summary_area table tbody tr td .project_title {
  font-size: 18px;
  margin-bottom: 4px;
}
.task_page .summary_area table tbody tr td .add_area {
  font-size: 10px;
}
.task_page .summary_area table tbody tr td .limit {
  font-size: 10px;
  background-color: #FFFFFF;
  color: #4372ba;
  margin-top: 8px;
  border-radius: 4px;
}
.task_page .summary_area table tbody tr td .limit span {
  font-size: 16px;
}
.task_page .summary_area table tbody tr td .red {
  color: #FF0000;
}
.task_page .summary_area table tbody tr:nth-of-type(1) td {
  padding: 8px;
  font-size: 12px;
}
.task_page .summary_area table.completed tbody td {
  background-color: #eaeaea;
}
.task_page .summary_area table.completed tbody td.reverse {
  background-color: #777777;
  border: solid 1px #4372ba;
}
.task_page .summary_area table.completed tbody td:last-of-type {
  background-color: #d1d8e3;
}
.task_page .summary_area table.completed tbody td .completed {
  color: #3be30d;
}
.task_page .summary_area_2 table {
  width: 100%;
  margin-bottom: 16px;
  border: solid 3px #4372ba;
}
.task_page .summary_area_2 table:nth-of-type(1) {
  margin-bottom: -2px;
  border-bottom: solid 1px #4372ba;
}
.task_page .summary_area_2 table:nth-of-type(2) {
  border-top: solid 1px #4372ba;
}
.task_page .summary_area_2 table thead tr th {
  text-align: center;
  padding: 8px;
  color: #4372ba;
  border: solid 3px #4372ba;
  border-bottom: solid 1px #4372ba;
}
.task_page .summary_area_2 table thead tr th:nth-of-type(1) {
  border-left: solid 3px transparent;
  border-top: solid 3px transparent;
  width: 17%;
}
.task_page .summary_area_2 table thead tr th:nth-of-type(2) {
  width: 11%;
  border-right: solid 1px #4372ba;
}
.task_page .summary_area_2 table thead tr th:nth-of-type(3) {
  width: 24%;
  border-left: solid 1px #4372ba;
}
.task_page .summary_area_2 table thead tr th:nth-of-type(4) {
  width: 48%;
}
.task_page .summary_area_2 table thead tr th:nth-of-type(4) .cost_view {
  color: #ffffff;
  background-color: #09984c;
  border-radius: 4px;
  padding: 4px;
  font-size: 10px;
  margin-left: 4px;
}
.task_page .summary_area_2 table tbody tr td {
  text-align: center;
  padding: 8px;
  border: solid 1px #4372ba;
  color: #4372ba;
  vertical-align: middle;
  font-size: 14px;
  font-weight: bold;
  width: 12%;
}
.task_page .summary_area_2 table tbody tr td:nth-of-type(1) {
  width: 17%;
  border: solid 3px #4372ba;
}
.task_page .summary_area_2 table tbody tr td:nth-of-type(1) button {
  border: 1px solid #4372ba;
  border-radius: 20px;
  padding: 0px 12px;
  display: flex;
  align-items: center;
  margin: auto;
  background-color: #ffffff;
  color: #4372ba;
  font-size: 10px;
  gap: 4px;
  padding: 4px 16px;
}
.task_page .summary_area_2 table tbody tr td:nth-of-type(2) {
  width: 11%;
}
.task_page .summary_area_2 table tbody tr td:nth-of-type(4) {
  border-right: solid 3px #4372ba;
}
.task_page .summary_area_2 table tbody tr td:last-of-type {
  border-right: solid 3px #4372ba;
}
.task_page .summary_area_2 table tbody tr td.reverse {
  background-color: #4372ba;
  color: #FFFFFF;
}
.task_page .summary_area_2 table tbody tr td .project_title {
  font-size: 18px;
  margin-bottom: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.task_page .summary_area_2 table tbody tr td .add_area {
  font-size: 10px;
}
.task_page .summary_area_2 table tbody tr td .limit {
  font-size: 10px;
  background-color: #FFFFFF;
  color: #4372ba;
  border-radius: 4px;
}
.task_page .summary_area_2 table tbody tr td .limit span {
  font-size: 16px;
}
.task_page .summary_area_2 table tbody tr td .red {
  color: #FF0000;
}
.task_page .summary_area_2 table tbody tr:nth-of-type(1) td {
  padding: 8px;
  font-size: 12px;
}
.task_page .summary_area_2 table tbody tr:nth-of-type(2n) td:nth-of-type(1) {
  width: 11%;
  border-top: solid 1px #4372ba;
  border-right: solid 1px #4372ba;
}
.task_page .summary_area_2 table tbody tr:nth-of-type(2n) td:nth-of-type(2) {
  width: 12%;
}
.task_page .summary_area_2 table tbody tr:nth-of-type(2n) td:nth-of-type(3) {
  border-right: solid 3px #4372ba;
}
.task_page .summary_area_2 table tbody tr:nth-of-type(2n) td:nth-of-type(4) {
  border-right: inherit;
  background-color: #E5EFFF;
}
.task_page .summary_area_2 table tbody tr:nth-of-type(2n) td:nth-of-type(5) {
  background-color: #EFFCEB;
}
.task_page .summary_area_2 table tbody tr:nth-of-type(2n) td:nth-of-type(6) {
  background-color: #E5E5E5;
}
.task_page .summary_area_2 table tbody tr:nth-of-type(2n) td:nth-of-type(7) {
  background-color: #4472BA;
  color: #FFFFFF;
  font-size: 22px;
}
.task_page .summary_area_2 table tbody tr:nth-of-type(2n) td:nth-of-type(7).zero {
  background-color: #E34242;
}
.task_page .summary_area_2 table.completed tbody td {
  background-color: #eaeaea;
}
.task_page .summary_area_2 table.completed tbody td.reverse {
  background-color: #777777;
}
.task_page .summary_area_2 table.completed tbody td .completed {
  color: #3be30d;
}
.task_page .summary_no_data {
  font-size: 16px;
  font-weight: bold;
  color: #999999;
  text-align: center;
  margin: 16px 0px;
}
.task_page .label_add_modal .add_button,
.task_page .label_add_modal .add_team {
  background-color: #d5e8d4;
  color: #82b366;
  border-radius: 20px;
  padding: 4px 8px;
  display: inline-block;
  margin-right: 8px;
  cursor: pointer;
  position: relative;
}
.task_page .label_add_modal .search_box {
  top: 30px;
  right: unset;
  border: 1px solid #cccccc;
  color: #666666;
}
.task_page .label_add_modal .search_box .search_detail {
  width: 300px;
}
.task_page .user_display_area {
  margin-bottom: 40px;
  font-size: 14px;
  color: #666666;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.task_page .user_display_area .profile_icon {
  border-radius: 50%;
  width: 24px;
  height: 24px;
}
.task_page .user_display_area .text {
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.task_page .user_display_area .text .user_name {
  font-size: 20px;
  font-weight: bold;
  color: #4372ba;
}
.task_page .task_detail .help {
  height: auto;
  width: 100%;
  padding: 0 24px;
}
.task_page .task_detail .help.min {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
  min-height: 1px;
}
.task_page .task_detail .help.no_padding {
  padding: 0;
}
.task_page .task_detail .help.fit {
  width: fit-content;
  padding: 0;
}
.task_page .task_detail .cost_viewable_label {
  color: #ffffff;
  background-color: #09984c;
  border-radius: 4px;
  padding: 4px;
  font-size: 10px;
}
.task_page .task_detail .display_range {
  font-size: 20px;
  margin-bottom: 16px;
  color: #4372ba;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.task_page .task_detail .display_range .details {
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .task_detail .display_range button {
  display: inline-block;
  text-align: center;
  min-width: 100px;
  background-color: #666666;
  border: 1px solid #666666;
  color: #FFFFFF;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 12px;
}
.task_page .task_detail .display_range button .completed {
  background-color: #008800;
  border: 1px solid #008800;
}
.task_page .task_detail .box_area {
  border: 1px solid #cccccc;
  border-radius: 5px;
  padding: 16px;
  margin-bottom: 24px;
}
.task_page .task_detail .box_area .title_area {
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.task_page .task_detail .box_area .title_area .title {
  font-size: 16px;
  font-weight: bold;
  color: #666666;
  display: flex;
  align-items: center;
}
.task_page .task_detail .box_area .title_area .title .cost_view {
  color: #ffffff;
  background-color: #09984c;
  border-radius: 4px;
  padding: 4px;
  font-size: 10px;
}
.task_page .task_detail .box_area .summary_block {
  display: flex;
  margin-bottom: 40px;
  margin-top: 40px;
  gap: 80px;
  padding: 0px 16px 0px 40px;
}
.task_page .task_detail .box_area .summary_block .ranking_block {
  border: 2px solid #4372ba;
  border-radius: 4px;
  padding: 16px;
  display: flex;
  flex-flow: column;
}
.task_page .task_detail .box_area .summary_block .ranking_block .ranking_title {
  width: 100%;
  font-size: 16px;
  font-weight: bold;
  color: #666666;
  margin: 8px 0px 24px;
}
.task_page .task_detail .box_area .summary_block .ranking_block .ranking_rows {
  max-height: 250px;
  overflow-y: auto;
  display: flex;
  flex-flow: column;
}
.task_page .task_detail .box_area .summary_block .ranking_block .ranking_rows .ranking_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: #666666;
  margin: 8px 0px;
  min-height: 24px;
}
.task_page .task_detail .box_area .summary_block .ranking_block .ranking_rows .ranking_row .ranking_title_area {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: bold;
}
.task_page .task_detail .box_area .summary_block .ranking_block .ranking_rows .ranking_row .ranking_title_area .icon_area {
  width: 40px;
  display: flex;
  justify-content: center;
  font-size: 20px;
  color: #999999;
}
.task_page .task_detail .box_area .summary_block .ranking_block .ranking_rows .ranking_row .ranking_title_area .text_area {
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .task_detail .box_area .summary_block .ranking_block .ranking_rows .ranking_row .ranking_title_area .text_area .icon {
  width: 24px;
  height: 24px;
  min-width: 16px;
  min-height: 16px;
  border-radius: 50%;
}
.task_page .task_detail .box_area .summary_block .ranking_block .ranking_rows .ranking_row .detail_area {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: bold;
}
.task_page .task_detail .box_area .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(1) .ranking_title_area {
  font-size: 18px;
}
.task_page .task_detail .box_area .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(1) .ranking_title_area .icon_area {
  font-size: 30px;
  color: #cfca04;
}
.task_page .task_detail .box_area .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(1) .detail_area {
  font-size: 18px;
}
.task_page .task_detail .box_area .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(2) .ranking_title_area .icon_area {
  font-size: 20px;
  color: #c0c0c0;
}
.task_page .task_detail .box_area .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(3) .ranking_title_area .icon_area {
  font-size: 20px;
  color: #c58204;
}
.task_page .task_detail .box_area .summary_block .ranking_block .no_data {
  font-size: 24px;
  font-weight: bold;
  color: #999999;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.task_page .task_detail .box_area .list_header {
  display: flex;
  justify-content: space-between;
  color: #4372ba;
  font-size: 14px;
  text-align: center;
  padding: 0px 16px;
}
.task_page .task_detail .box_area .list_header > div {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.task_page .task_detail .box_area .list_header > div:nth-of-type(1) {
  width: 34%;
}
.task_page .task_detail .box_area .list_header > div:nth-of-type(2) {
  width: calc(66% + 3px);
  border: 2px solid #4372ba;
  padding: 8px;
}
.task_page .task_detail .box_area .list_header.cost_view > div:nth-of-type(2) {
  width: calc(33% + 2px);
  border: 2px solid #4372ba;
  padding: 8px;
}
.task_page .task_detail .box_area .list_header.cost_view > div:nth-of-type(3) {
  width: calc(33% + 2px);
  border-top: 2px solid #4372ba;
  border-right: 2px solid #4372ba;
  border-bottom: 2px solid #4372ba;
  border-left: none;
  border-image: initial;
  padding: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.task_page .task_detail .box_area .list_header.cost_view > div:nth-of-type(3) .cost_view {
  color: #ffffff;
  background-color: #09984c;
  border-radius: 4px;
  padding: 4px;
  font-size: 10px;
}
.task_page .task_detail .box_area .list_row_wrapper {
  padding: 0px 16px;
  display: flex;
  flex-flow: column;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row {
  width: 100%;
  min-height: 45px;
  display: flex;
  justify-content: space-between;
  border: 3px solid #4372ba;
  color: #4372ba;
  font-size: 18px;
  font-weight: bold;
  cursor: pointer;
  margin-top: -3px;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row > div.title_display_area {
  width: calc(100% - 500px);
  padding: 8px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-right: 2px solid #4372ba;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row > div.title_display_area .text_area {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row > div.title_display_area .text_area .icon {
  width: 12px;
  height: 12px;
  min-width: 12px;
  min-height: 12px;
  border-radius: 50%;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row > div.title_display_area .text_area .approved_label {
  background-color: #09984c;
  border-radius: 4px;
  color: #ffffff;
  font-size: 10px;
  padding: 2px 4px;
  white-space: nowrap;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row > div.title_display_area .text_area .approved_label.not_approved {
  background-color: #ff0000;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row > div.title_display_area button {
  border: 1px solid #4372ba;
  border-radius: 20px;
  font-size: 12px;
  padding: 4px 16px;
  display: flex;
  align-items: center;
  gap: 4px;
  word-break: keep-all;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row > div.title_display_area button:hover {
  background-color: #f0f8ff;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row > div.work_time {
  width: 500px;
  padding: 8px 16px;
  text-align: right;
  border-right: 0;
  display: flex;
  justify-content: right;
  align-items: center;
  gap: 4px;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row.cost_view > div.work_time {
  width: 250px;
  padding: 8px 16px;
  text-align: right;
  border-right: 2px solid #4372ba;
  display: flex;
  justify-content: right;
  align-items: center;
  gap: 4px;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row.cost_view > div.work_cost {
  width: 250px;
  padding: 8px 16px;
  text-align: right;
  background-color: #ecfdea;
  display: flex;
  justify-content: right;
  align-items: center;
  gap: 4px;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row.header_area {
  font-size: 13px;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row.header_area > div.title_display_area {
  justify-content: center;
}
.task_page .task_detail .box_area .list_row_wrapper .list_row.header_area > div.work_time, .task_page .task_detail .box_area .list_row_wrapper .list_row.header_area > div.work_cost {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.task_page .task_detail .box_area .list_row_wrapper .detail_row_wrapper {
  margin: 16px 0px 24px;
  position: relative;
}
.task_page .task_detail .box_area .list_row_wrapper .detail_row_wrapper .ruled_line {
  position: absolute;
  top: -16px;
  left: 16px;
}
.task_page .task_detail .box_area .list_row_wrapper .detail_row_wrapper .ruled_line > div:nth-of-type(1) {
  width: 2px;
  height: 30px;
  background-color: #4372ba;
}
.task_page .task_detail .box_area .list_row_wrapper .detail_row_wrapper .ruled_line > div:nth-of-type(2) {
  width: 25px;
  height: 2px;
  background-color: #4372ba;
}
.task_page .task_detail .box_area .list_row_wrapper .detail_row_wrapper .detail_row {
  display: flex;
  justify-content: space-between;
  margin-left: 40px;
  margin-top: -2px;
  border: 2px solid #4372ba;
  color: #4372ba;
  font-size: 14px;
  font-weight: bold;
  min-height: 44px;
}
.task_page .task_detail .box_area .list_row_wrapper .detail_row_wrapper .detail_row > div.title_display_area {
  width: calc(100% - 500px);
  padding: 8px 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  border-right: 2px solid #4372ba;
  justify-content: space-between;
}
.task_page .task_detail .box_area .list_row_wrapper .detail_row_wrapper .detail_row > div.title_display_area .icon {
  width: 12px;
  height: 12px;
  min-width: 12px;
  min-height: 12px;
  border-radius: 50%;
}
.task_page .task_detail .box_area .list_row_wrapper .detail_row_wrapper .detail_row > div.work_time {
  width: 500px;
  padding: 8px 16px;
  text-align: right;
  border-right: 0;
  display: flex;
  align-items: center;
  justify-content: right;
}
.task_page .task_detail .box_area .list_row_wrapper .detail_row_wrapper .detail_row.cost_view > div.work_time {
  width: 250px;
  padding: 8px 16px;
  border-right: 2px solid #4372ba;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.task_page .task_detail .box_area .list_row_wrapper .detail_row_wrapper .detail_row.cost_view > div.work_cost {
  width: 250px;
  padding: 8px 16px;
  background-color: #ecfdea;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.task_page .task_detail .box_area .list_row_wrapper.for_category {
  flex-flow: initial;
}
.task_page .task_detail .box_area .list_row_wrapper.for_category .ruler_area {
  width: 20px;
  position: relative;
}
.task_page .task_detail .box_area .list_row_wrapper.for_category .ruler_area .vertical {
  position: absolute;
  top: -8px;
  right: 9px;
  width: 3px;
  height: 28px;
  background-color: #4372ba;
}
.task_page .task_detail .box_area .list_row_wrapper.for_category .ruler_area .horizontal {
  position: absolute;
  right: 0px;
  bottom: 50%;
  width: 12px;
  height: 3px;
  background-color: #4372ba;
}
.task_page .task_detail .box_area .profit_area {
  display: flex;
}
.task_page .task_detail .box_area .profit_area .breakdown_list {
  padding: 16px;
  width: 50%;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row {
  display: flex;
  justify-content: space-between;
  border-top: 2px solid #4372ba;
  border-bottom: 2px solid #4372ba;
  color: #4372ba;
  font-size: 18px;
  font-weight: bold;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row > div:nth-of-type(1) {
  width: 50%;
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row > div:nth-of-type(1) .icon {
  border-radius: 50%;
  width: 16px;
  min-width: 16px;
  height: 16px;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row > div:nth-of-type(2) {
  width: 50%;
  padding: 16px;
  text-align: right;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.budget > div:nth-of-type(2) {
  background-color: #e5efff;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.work_cost {
  margin-top: -2px;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.work_cost > div:nth-of-type(2) {
  background-color: #ecfdea;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.other_cost {
  margin-top: -1px;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.other_cost > div:nth-of-type(2) {
  background-color: #ececec;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.work_cost_detail {
  margin-left: 24px;
  border-bottom: 1px solid #4372ba;
  border-top: none;
  font-size: 14px;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.work_cost_detail > div:nth-of-type(1) {
  width: calc(50% - 12px);
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.work_cost_detail > div:nth-of-type(2) {
  width: calc(50% + 12px);
  padding: 16px;
  text-align: right;
  background-color: #ecfdea;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.other_cost_detail {
  margin-left: 24px;
  border-bottom: 1px solid #4372ba;
  border-top: none;
  font-size: 14px;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.other_cost_detail > div:nth-of-type(1) {
  width: calc(50% - 12px);
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.other_cost_detail > div:nth-of-type(2) {
  width: calc(50% + 12px);
  padding: 16px;
  text-align: right;
  background-color: #ececec;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.result {
  margin-top: -1px;
  font-size: 30px;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.result > div:nth-of-type(1) {
  color: #4372ba;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.result > div:nth-of-type(2) {
  color: #ffffff;
  background-color: #4372ba;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.result.negative > div:nth-of-type(1) {
  color: #E34242;
}
.task_page .task_detail .box_area .profit_area .breakdown_list .breakdown_row.result.negative > div:nth-of-type(2) {
  color: #ffffff;
  background-color: #E34242;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper {
  padding: 16px;
  width: 50%;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .graph_area {
  display: flex;
  gap: 4px;
  height: calc(100% - 24px);
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .graph_area > div {
  width: 50%;
  display: flex;
  flex-flow: column;
  gap: 2px;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .graph_area > div .block {
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  border: 2px solid #4372ba;
  border-radius: 8px;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .graph_area > div .block .text_area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #4372ba;
  font-size: 14px;
  font-weight: bold;
  width: 100%;
  padding: 0px 16px;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .graph_area > div .block .text_area > div:nth-of-type(1) {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .graph_area > div .block .text_area > div:nth-of-type(1) .icon {
  border-radius: 50%;
  width: 16px;
  min-width: 16px;
  height: 16px;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .graph_area > div .block.budget {
  background-color: #e5efff;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .graph_area > div .block.work {
  background-color: #ecfdea;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .graph_area > div .block.other {
  background-color: #ececec;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .graph_area > div .block.result {
  background-color: #4372ba;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .graph_area > div .block.result .text_area {
  color: #ffffff;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .graph_area > div .block.result.negative {
  background-color: #E34242;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .label_area {
  display: flex;
  align-items: center;
  margin-top: 4px;
  color: #4372ba;
  font-weight: bold;
  height: 20px;
  text-align: center;
}
.task_page .task_detail .box_area .profit_area .graph_wrapper .label_area > div {
  width: 50%;
}
.task_page .task_status_card_area {
  display: flex;
  flex-flow: wrap;
  gap: 10px;
  justify-content: center;
}
.task_page .task_status_card_area .task_status_card {
  border: 1px solid #cccccc;
  border-radius: 4px;
  width: calc((100% - 20px) / 3);
  max-width: 380px;
}
.task_page .task_status_card_area .task_status_card .header_area {
  padding: 8px 16px;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.task_page .task_status_card_area .task_status_card .header_area .name {
  font-size: 16px;
}
.task_page .task_status_card_area .task_status_card .header_area .link {
  font-size: 10px;
  color: #4472ba;
  cursor: pointer;
  text-decoration: underline;
}
.task_page .task_status_card_area .task_status_card .contents_area {
  padding: 16px 8px;
  height: 270px;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area {
  display: flex;
  justify-content: space-between;
  flex-flow: row-reverse;
  height: 100%;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .left_area {
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .left_area .block_wrapper {
  border: 1px solid #cccccc;
  background-color: #eeeeee;
  padding: 8px;
  display: flex;
  flex-flow: column;
  gap: 8px;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .right_area {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: 10px;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .right_area .graph_area {
  position: relative;
  display: flex;
  align-items: center;
  height: 200px;
  width: 180px;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .right_area .graph_area .block_area {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  font-size: 24px;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-flow: wrap;
  justify-content: center;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block {
  color: #666666;
  font-size: 18px;
  background-color: #ffffff;
  padding: 8px;
  position: relative;
  text-align: center;
  border: 1px solid #999999;
  border-radius: 4px;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block .title {
  font-size: 12px;
  margin-bottom: 4px;
  white-space: nowrap;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block.total .line {
  width: 20px;
  height: 1px;
  background-color: #999999;
  position: absolute;
  top: 50%;
  right: 0px;
  transform: translateX(100%) translateY(-50%);
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block.inoperable {
  background-color: #666666;
  color: #FFFFFF;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block.not_covered {
  background-color: #f8f8f8;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block.not_covered.check {
  color: #FFFFFF;
  background-color: #999999;
  border: 2px solid #333333;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block.not_labeling {
  border: 1px solid #c61616;
  font-size: 24px;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block.not_labeling .value {
  color: #c61616;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block.not_labeling.check {
  color: #FFFFFF;
  background-color: #c61616;
  border: 1px solid #FFFFFF;
  font-size: 30px;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block.not_labeling.check .value {
  color: #FFFFFF;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block.labeling {
  border: 1px solid #0d9554;
  font-size: 24px;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block.labeling .value {
  color: #0d9554;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block.test {
  border: 1px solid #0493b1;
  font-size: 24px;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block.test .value {
  color: #0493b1;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block.manual {
  color: #ffffff;
  background-color: #336fcc;
  border: 4px solid #2fa7eb;
}
.task_page .task_status_card_area .task_status_card .contents_area .summary_area .block .min_button {
  padding: 2px 8px;
  border: 1px solid #4e71b5;
  border-radius: 4px;
  background-color: #ffffff;
  color: #4e71b5;
  font-size: 10px;
}
.task_page .task_status_card_area .task_status_card .contents_area .detail_area {
  display: flex;
  gap: 10px;
  height: 220px;
  margin-top: 10px;
}
.task_page .task_status_card_area .task_status_card .contents_area .detail_area .left_area {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
}
.task_page .task_status_card_area .task_status_card .contents_area .detail_area .center_area {
  display: flex;
  align-items: center;
  width: 100%;
  flex-flow: column;
  justify-content: center;
  gap: 20px;
}
.task_page .task_status_card_area .task_status_card .contents_area .detail_area .right_area {
  display: flex;
  align-items: center;
  width: 100%;
  flex-flow: column;
}
.task_page .task_status_card_area .task_status_card .contents_area .detail_area .bar_area {
  display: flex;
  align-items: center;
  width: 100%;
  position: relative;
  justify-content: center;
}
.task_page .task_status_card_area .task_status_card .contents_area .detail_area .bar_area .title_area {
  position: absolute;
  top: -24px;
  border-bottom: 1px solid #999999;
  color: #999999;
  font-size: 10px;
  width: 70%;
  text-align: center;
  padding-bottom: 2px;
}
.task_page .task_status_card_area .task_status_card .contents_area .detail_area .bar_area .legend_area {
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%) translateY(100%);
  font-size: 10px;
  white-space: nowrap;
  width: 70%;
}
.task_page .task_status_card_area .task_status_card .contents_area .detail_area .bar_area .legend_area > div {
  color: #666666;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .task_status_card_area .task_status_card .contents_area .no_data {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-size: 16px;
  color: #999999;
}
.task_page .task_status_card_area .task_status_card.check {
  border: 2px solid #c61616;
}
.task_page .task_status_list_area {
  display: flex;
  flex-flow: column;
  gap: 4px;
}
.task_page .task_status_list_area .task_status_list_detail {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid #cccccc;
  padding: 8px;
  position: relative;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_name_area {
  width: 300px;
  display: flex;
  align-items: flex-start;
  flex-flow: column;
  gap: 4px;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_name_area .user_name {
  font-size: 14px;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_name_area .task_link {
  font-size: 14px;
  font-size: 10px;
  color: #4472ba;
  cursor: pointer;
  text-decoration: underline;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_data_area {
  width: calc(100% - 300px);
  display: flex;
  gap: 4px;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_data_area .left_area {
  display: flex;
  flex-flow: column;
  gap: 4px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 4px;
  width: 50%;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_data_area .left_area .detail_area {
  display: flex;
  gap: 4px;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_data_area .left_area .detail_area .detail_block {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 4px;
  position: relative;
  width: 50%;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_data_area .left_area .detail_area .detail_block .label {
  padding: 4px 8px;
  font-size: 10px;
  border-radius: 4px;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_data_area .left_area .bar_area {
  display: flex;
  height: 22px;
  text-align: center;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_data_area .left_area .bar_area .bar {
  width: 100%;
  text-align: center;
  line-height: 22px;
  height: 100%;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_data_area .right_area {
  display: flex;
  flex-flow: column;
  gap: 4px;
  width: 50%;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_data_area .right_area .detail_block {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 4px;
  position: relative;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_data_area .right_area .detail_block .label {
  padding: 4px 8px;
  font-size: 10px;
  border-radius: 4px;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_data_area .right_area .detail_block button {
  text-decoration: underline;
  color: #4e71b5;
  font-size: 10px;
  padding: 0px;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_data_area .right_area .detail_block button.del {
  color: #ff0000;
}
.task_page .task_status_list_area .task_status_list_detail .task_status_list_data_area .no_data {
  margin: auto;
  font-size: 16px;
  font-weight: bold;
  color: #999999;
}
.task_page .more_button_area {
  display: flex;
  justify-content: center;
  margin-top: 24px;
}
.task_page .more_button_area button {
  border: 1px solid #999999;
  border-radius: 40px;
  min-width: 200px;
  text-align: center;
}
.task_page .select_task .label_wrapper {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .select_task .label_wrapper .c_icon {
  color: #999999;
  transform: rotate(-25deg);
}
.task_page .select_task .label_wrapper .label {
  background-color: #FFFFFF;
  border: solid 2px #747474;
  border-radius: 4px;
  font-size: 10px;
  padding: 4px 6px;
  display: flex;
  align-items: center;
  gap: 4px;
  pointer-events: initial;
  cursor: default;
}
.task_page .select_task .label_wrapper .label .delete {
  cursor: pointer;
}
.task_page .select_task .label_wrapper.pending .label {
  border: dotted 1px #FF0000;
  background-color: #ffc3c361;
  padding: 2px 6px;
  z-index: 1;
}
.task_page .select_task .label_wrapper.pending .label .strong {
  font-weight: bold;
}
.task_page .select_task .label_wrapper.pending .label .dummy_label {
  font-weight: bold;
  background-color: #FFFFFF;
  border: solid 2px #747474;
  border-radius: 4px;
  font-size: 10px;
  padding: 4px 6px;
}
.task_page .select_task .label_wrapper.pending .label .done {
  color: #04a304;
  border: solid 1px #04a304;
  background-color: #FFF;
  border-radius: 16px;
  padding: 2px 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .select_task .label_wrapper.pending .label .done:hover {
  background-color: #ddffdc;
}
.task_page .select_task .label_wrapper.pending .label .delete {
  color: #747474;
  border: solid 1px #747474;
  background-color: #FFF;
  border-radius: 16px;
  padding: 2px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .select_task .label_wrapper.pending .label .delete:hover {
  background-color: #E3E3E3;
}
.task_page .select_task .label_wrapper.pending .label .automatic {
  color: #747474;
  border: solid 1px #87CDEB;
  background-color: #FFF;
  border-radius: 16px;
  padding: 2px 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .select_task .label_wrapper.pending .label .automatic .icon {
  color: #87CDEB;
}
.task_page .select_task .label_wrapper.pending .label .automatic:hover {
  background-color: #e4f7ff;
}
.task_page .select_task .label_wrapper.auto .c_icon {
  color: #03CCCC;
  transform: none;
}
.task_page .select_task .label_wrapper.auto .label {
  border: solid 2px #03CCCC;
}
.task_page .select_task .label_wrapper.persistence .c_icon {
  color: #87ceeb;
  transform: none;
}
.task_page .select_task .label_wrapper.persistence .label {
  border: solid 2px #87ceeb;
}
.task_page .select_task .label_wrapper.not_belong .c_icon {
  color: #0493b1;
  transform: none;
}
.task_page .select_task .label_wrapper.not_belong .label {
  border: solid 2px #0493b1;
  background-color: #0493b1;
  color: #FFFFFF;
}
.task_page .select_task .label_wrapper.no_label .label {
  border: solid 2px #e44242;
  color: #e44242;
}
.task_page .select_task .label_wrapper.break .c_icon {
  color: #e88042;
  transform: none;
}
.task_page .select_task .label_wrapper.break .label {
  border: solid 2px #e88042;
  background-color: #e88042;
  color: #FFFFFF;
}
.task_page .select_task .add_label {
  border-radius: 4px;
  padding: 6px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  position: relative;
  font-size: 10px;
  background-color: #E44242;
  color: #ffffff;
  pointer-events: initial;
  margin-left: 20px;
}
.task_page .changeable_table_header {
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .changeable_table_header .changeable_table_header_title {
  display: inline-block;
  position: relative;
  font-size: 16px;
}
.task_page .changeable_table_header .button_area button {
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 4px 6px;
  display: flex;
  gap: 4px;
}
.task_page .approval_setting_box {
  display: flex;
  flex-flow: column;
  border: 1px solid #cccccc;
  border-radius: 4px;
  background-color: #ffffff;
}
.task_page .approval_setting_box .approver_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 8px;
  border-bottom: 1px dashed #cccccc;
  min-height: 70px;
}
.task_page .approval_setting_box .approver_area .approver_block {
  border: 1px solid #cccccc;
  border-radius: 4px;
  width: 130px;
  background-color: #ffffff;
}
.task_page .approval_setting_box .approver_area .approver_block.member {
  padding: 20px 8px;
  text-align: center;
}
.task_page .approval_setting_box .approver_area .approver_block .approver_block_title {
  background-color: #eeeeee;
  padding: 4px;
  border-radius: 4px 4px 0px 0px;
  color: #666666;
  text-align: center;
}
.task_page .approval_setting_box .approver_area .approver_block .approver_block_name {
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.task_page .approval_setting_box .approver_area .approver_block .approver_block_name .profile_icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
.task_page .approval_setting_box .member_list {
  padding: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-height: unset;
}
.task_page .approval_setting_box .member_list .member_label {
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 20px;
  padding: 4px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .approval_setting_box .member_list .member_label .profile_icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
.task_page .create_group {
  border: 2px dashed #4572ba;
  border-Radius: 5px;
  padding: 16px;
  text-align: center;
  color: #4572ba;
  font-size: 14px;
  margin: 16px 0px;
  width: 100%;
}
.task_page .flow_wrapper {
  display: flex;
  flex-flow: column;
}
.task_page .flow_wrapper .approver_block {
  border: 1px solid #cccccc;
  border-radius: 4px;
  width: 130px;
  background-color: #ffffff;
}
.task_page .flow_wrapper .approver_block.member {
  padding: 20px 8px;
  text-align: center;
}
.task_page .flow_wrapper .approver_block .approver_block_title {
  background-color: #eeeeee;
  padding: 4px;
  border-radius: 4px 4px 0px 0px;
  color: #666666;
  text-align: center;
}
.task_page .flow_wrapper .approver_block .approver_block_name {
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.task_page .flow_wrapper .approver_block .approver_block_name .profile_icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
.task_page .display_member {
  padding: 4px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .display_member .profile_icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
.task_page .button_control_area {
  display: flex;
  gap: 8px;
}
.task_page .button_control_area button {
  color: #666666;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 12px;
  background-color: #eeeeee;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.task_page .button_control_area button:hover {
  opacity: 0.8;
}
.task_page .application_control_area {
  display: flex;
  justify-content: right;
  margin-bottom: 24px;
  background-color: #f7f7f7;
  padding: 8px;
}
.task_page .application_control_area button {
  color: #666666;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 12px;
  background-color: #eeeeee;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.task_page .application_control_area button:hover {
  opacity: 0.8;
}
.task_page .summary_view_area {
  display: flex;
  flex-flow: column;
  gap: 8px;
  margin-bottom: 24px;
  background-color: #f7f7f7;
  padding: 16px;
}
.task_page .summary_view_area .summary_view_control_area {
  display: flex;
  align-items: end;
  gap: 4px;
  border-bottom: 1px solid #dddddd;
  padding: 4px 8px;
}
.task_page .summary_view_area .summary_view_control_area .summary_select_area_wrapper {
  position: relative;
}
.task_page .summary_view_area .summary_view_control_area .summary_select_area_wrapper .summary_select_area {
  display: flex;
  align-items: center;
  gap: 4px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 4px;
  background-color: #ffffff;
  cursor: pointer;
}
.task_page .summary_view_area .summary_view_control_area .summary_select_area_wrapper .summary_type_list {
  background-color: #ffffff;
  position: absolute;
  width: 300px;
  padding: 4px;
  z-index: 2010;
  display: flex;
  flex-flow: column;
  gap: 4px;
}
.task_page .summary_view_area .summary_view_control_area .summary_select_area_wrapper .summary_type_list .summary_type {
  display: flex;
  align-items: end;
  gap: 4px;
  cursor: pointer;
  padding: 4px;
  border: 1px solid #cccccc;
  background-color: #ffffff;
}
.task_page .summary_view_area .summary_view_control_area .summary_select_area_wrapper .summary_type_list .summary_type.active {
  background-color: #f4faf9;
}
.task_page .summary_view_area .summary_view_control_area .summary_select_area_wrapper .summary_type_list .summary_type:hover {
  opacity: 0.8;
}
.task_page .summary_view_area .summary_view_control_area .summary_select_area_wrapper .summary_type_list_screen {
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 2003;
  width: 100vw;
  height: 100vh;
}
.task_page .application_list {
  display: flex;
  gap: 1px;
  background-color: #cccccc;
  zoom: 0.9;
  flex-flow: column;
}
.task_page .application_list .application_list_row {
  display: flex;
  align-items: center;
  min-height: 40px;
  padding: 8px;
  background-color: #ffffff;
}
.task_page .application_list .application_list_row .checkbox_column {
  width: 20px;
}
.task_page .application_list .application_list_row .checkbox_column > div {
  font-size: 15px;
}
.task_page .application_list .application_list_row .name_column {
  min-width: calc(20% - 4px);
  display: flex;
  flex-flow: column;
  gap: 4px;
  white-space: nowrap;
}
.task_page .application_list .application_list_row .name_column .up_area {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}
.task_page .application_list .application_list_row .name_column .status_label {
  display: flex;
  align-items: center;
  gap: 4px;
  border-radius: 4px;
  padding: 2px 4px;
  font-size: 10px;
}
.task_page .application_list .application_list_row .main_column {
  width: calc(80% - 16px);
  display: flex;
  gap: 8px;
}
.task_page .application_list .application_list_row .main_column .main_column_left {
  width: 250px;
  display: flex;
  justify-content: center;
  flex-flow: column;
  gap: 4px;
  padding: 4px 8px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  background-color: #ffffff;
}
.task_page .application_list .application_list_row .main_column .main_column_left .up_area {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-bottom: 1px dashed #cccccc;
  padding-bottom: 4px;
}
.task_page .application_list .application_list_row .main_column .main_column_left .down_area {
  width: 100%;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.task_page .application_list .application_list_row .main_column .main_column_left .value {
  font-size: 18px;
}
.task_page .application_list .application_list_row .main_column .main_column_left .value.min {
  font-size: 14px;
}
.task_page .application_list .application_list_row .main_column .main_column_left .title_label {
  background-color: #000000;
  color: #FFFFFF;
  font-size: 12px;
  border-radius: 4px;
  padding: 2px 4px;
}
.task_page .application_list .application_list_row .main_column .main_column_right {
  width: calc(100% - 380px);
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.task_page .application_list .application_list_row .main_column .main_column_right .main_column_contents_wrapper {
  display: flex;
  flex-flow: column;
  gap: 4px;
  padding: 4px;
  width: 100%;
  border: 1px solid #cccccc;
  border-radius: 4px;
  background-color: #ffffff;
}
.task_page .application_list .application_list_row .main_column .main_column_right .main_column_contents_wrapper .detail_area {
  display: flex;
  gap: 4px;
  height: 40px;
}
.task_page .application_list .application_list_row .main_column .main_column_right .main_column_contents_wrapper .detail_area .detail_block {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 4px;
  position: relative;
  width: 50%;
}
.task_page .application_list .application_list_row .main_column .main_column_right .main_column_contents_wrapper .detail_area .detail_block .label {
  padding: 4px 8px;
  font-size: 10px;
  border-radius: 4px;
}
.task_page .application_list .application_list_row .main_column .main_column_right .main_column_contents_wrapper .bar_area {
  display: flex;
  height: 30px;
  text-align: center;
}
.task_page .application_list .application_list_row .main_column .main_column_right .main_column_contents_wrapper .bar_area .bar {
  width: 100%;
  text-align: center;
  line-height: 30px;
  height: 100%;
}
.task_page .application_list .application_list_row .main_column .main_column_button {
  width: 130px;
  display: flex;
  align-items: center;
  justify-content: right;
}
.task_page .application_list .application_list_row .main_column .main_column_button button {
  padding: 4px 16px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  text-align: center;
  font-size: 10px;
  background-color: #f8f8ff;
}
.task_page .application_list .application_list_row .main_column .main_column_button button:hover {
  opacity: 0.8;
}
.task_page .application_list .application_list_row .main_column.no_data {
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  color: #999999;
}
.task_page .application_date_wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 1px;
  background-color: #cccccc;
  border: 1px solid #cccccc;
  zoom: 0.9;
}
.task_page .application_date_wrapper .date {
  width: calc((100% - 6px) / 7);
  padding: 8px;
  background-color: #ffffff;
  min-height: 100px;
}
.task_page .application_date_wrapper .date.disable {
  background-color: #eeeeee;
}
.task_page .application_date_wrapper .date .date_header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}
.task_page .application_date_wrapper .date .date_header .date_header_left {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .application_date_wrapper .date .date_header .status_label {
  display: flex;
  align-items: center;
  gap: 4px;
  border-radius: 4px;
  padding: 2px 4px;
  font-size: 10px;
}
.task_page .application_date_wrapper .date .work_time {
  text-align: center;
  margin-bottom: 4px;
  color: #666666;
  display: flex;
  justify-content: center;
  gap: 8px;
}
.task_page .application_date_wrapper .date .work_time > div {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .application_date_wrapper .date .work_time > div .label_chip {
  background-color: #2196f3;
  color: #ffffff;
  font-size: 9px;
  border-radius: 4px;
  padding: 2px 4px;
}
.task_page .application_date_wrapper .date .graph_area {
  position: relative;
  margin-bottom: 8px;
}
.task_page .application_date_wrapper .date .graph_area .text_area {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: fit-content;
  text-align: center;
}
.task_page .application_date_wrapper .date .graph_area .text_area .text_area_title {
  font-size: 10px;
  text-align: center;
  color: #666666;
}
.task_page .application_date_wrapper .date .graph_area .text_area .text_area_text {
  font-size: 20px;
  color: #0f9655;
  font-weight: bold;
}
.task_page .application_date_wrapper .date button.detail_button {
  width: 100%;
  padding: 4px 0px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  text-align: center;
  font-size: 10px;
  background-color: #f8f8ff;
}
.task_page .application_date_wrapper .date button.detail_button:hover {
  opacity: 0.8;
}
.task_page .application_date_wrapper .date .no_data {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100px;
  font-size: 16px;
  font-weight: bold;
  color: #999999;
}
.task_page .application_legend {
  display: flex;
  flex-flow: column;
  gap: 4px;
  font-size: 10px;
  color: #666666;
  background-color: #eeeeee;
  padding: 4px 8px;
  border-radius: 4px;
}
.task_page .application_legend .legend_row {
  display: flex;
  justify-content: right;
  gap: 4px;
}
.task_page .application_legend .legend_block {
  display: flex;
  align-items: center;
  gap: 4px;
  border: 1px solid #cccccc;
  padding: 4px;
  background-color: #ffffff;
  border-radius: 4px;
}
.task_page .status_icon {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border-radius: 4px;
  padding: 2px 4px;
  font-size: 10px;
}
.task_page .calendar_table_row {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #cccccc;
}
.task_page .calendar_table_row .left_area {
  width: 150px;
  padding: 4px;
}
.task_page .calendar_table_row .right_area {
  width: calc(100% - 150px);
  display: flex;
  gap: 1px;
}
.task_page .calendar_table_row .right_area > div {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 4px;
}
.task_page .calendar_table_row.header_area {
  font-weight: bold;
}
.task_page .calendar_table_row.header_area .left_area {
  padding: 0;
  text-align: center;
}
.task_page .lock_belt {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  color: #ffffff;
  padding: 8px;
  margin: -24px -24px 8px;
}
.task_page .lock_belt > div {
  font-size: 12px;
}
.task_page .category_block_wrapper {
  display: flex;
  margin-bottom: 16px;
}
.task_page .category_block_wrapper .category_block {
  width: 100%;
  margin-top: 24px;
}
.task_page .category_block_wrapper .category_block .tag {
  padding: 8px 24px 4px 16px;
  border-radius: 8px 20px 0px 0px;
  font-size: 14px;
  font-weight: bold;
  width: fit-content;
  margin-bottom: -12px;
}
.task_page .category_block_wrapper .category_block .tag .tag_text {
  color: #FFFFFF;
  white-space: nowrap;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper {
  padding: 16px;
  border-radius: 0px 8px 8px;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail {
  background-color: #ffffff;
  padding: 16px;
  border-radius: 8px;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_title {
  border-bottom: 1px solid #999999;
  margin-bottom: 8px;
  padding: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_title .category_name {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 20px;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_title button {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #999999;
  border-radius: 4px;
  color: #333333;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_title button:hover {
  opacity: 0.8;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_values {
  border-bottom: 1px solid #999999;
  margin-bottom: 8px;
  padding: 8px;
  display: flex;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_values > div {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 50%;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_values > div .value_wrapper {
  display: flex;
  align-items: center;
  gap: 16px;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_values > div .value_wrapper .value_block {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_values > div .value_wrapper .value_block .value_label {
  padding: 4px;
  border-radius: 4px;
  font-size: 10px;
  color: #ffffff;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_values > div .value_wrapper .value_block .value_label.scheduled {
  background-color: #00a215;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_values > div .value_wrapper .value_block .value_label.actual {
  background-color: #ff0000;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_project {
  padding: 8px;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_project .project_title {
  margin-bottom: 8px;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_project .project_chip_wrapper {
  display: flex;
  justify-content: left;
  align-items: center;
  gap: 8px;
  flex-flow: wrap;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_project .project_chip_wrapper .project_chip {
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 20px;
  padding: 4px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .category_block_detail .category_block_detail_project .project_chip_wrapper .project_chip > div {
  width: 12px;
  height: 12px;
}
.task_page .category_block_wrapper .category_block .category_block_detail_wrapper .open_folder_button {
  background-color: #ffffff;
  padding: 8px;
  margin-top: 16px;
  border-radius: 4px;
  display: flex;
  gap: 4px;
  align-items: center;
}
.task_page .gantt_modal fieldset {
  border: solid 1px #999999;
  border-radius: 4px;
  padding: 24px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 24px;
  position: relative;
}
.task_page .gantt_modal fieldset.no_check {
  border: none;
  padding: 0 24px 16px;
}
.task_page .gantt_modal fieldset legend {
  font-size: 14px;
  font-weight: bold;
  padding: 0 8px;
  color: #666666;
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .gantt_modal fieldset legend.pointer {
  cursor: pointer;
}
.task_page .gantt_modal fieldset legend .check_area {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .gantt_modal fieldset legend .check_title {
  font-size: 12px;
}
.task_page .gantt_modal fieldset legend .required {
  background-color: #eb3333;
  border-radius: 6px;
  color: #FFFFFF;
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 100;
}
.task_page .gantt_modal fieldset .legend {
  display: flex;
  align-items: center;
  gap: 8px;
  position: absolute;
  top: -8px;
  background-color: #FFFFFF;
  color: #666666;
  font-weight: bold;
  font-size: 14px;
  padding: 0 8px;
  cursor: pointer;
}
.task_page .gantt_modal fieldset .legend .check_area {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: normal;
}
.task_page .gantt_modal fieldset .item.w10 {
  width: calc(10% - 8px);
}
.task_page .gantt_modal fieldset .item.w20 {
  width: calc(20% - 8px);
}
.task_page .gantt_modal fieldset .item.w30 {
  width: calc(30% - 8px);
}
.task_page .gantt_modal fieldset .item.w40 {
  width: calc(40% - 8px);
}
.task_page .gantt_modal fieldset .item.w50 {
  width: calc(50% - 8px);
}
.task_page .gantt_modal fieldset .item.w60 {
  width: calc(60% - 8px);
}
.task_page .gantt_modal fieldset .item.w70 {
  width: calc(70% - 8px);
}
.task_page .gantt_modal fieldset .item.w80 {
  width: calc(80% - 8px);
}
.task_page .gantt_modal fieldset .item.w90 {
  width: calc(90% - 8px);
}
.task_page .gantt_modal fieldset .item.w100 {
  width: 100%;
}
.task_page .gantt_modal fieldset .link {
  margin-left: 8px;
  color: #3a5f99;
  text-decoration: underline;
  cursor: pointer;
}
.task_page .gantt_modal fieldset .calendar_box {
  left: 0;
  right: unset;
}
.task_page .gantt_modal .button_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
}
.task_page .gantt_modal .button_area .button {
  display: inline-block;
  text-align: center;
  min-width: 200px;
  background-color: #4472BA;
  border: 1px solid #4472BA;
  color: #FFFFFF;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 14px;
}
.task_page .gantt_modal .button_area .button:hover {
  background-color: #094E8D;
  text-decoration: none;
}
.task_page .gantt_modal .button_area .button:disabled {
  opacity: 0.5;
}
.task_page .gantt_modal .button_area .button:disabled:hover {
  background-color: #4472BA;
  text-decoration: none;
}
.task_page .gantt_modal .button_area .button.delete {
  background-color: #C61616;
  border: 1px solid #C61616;
  color: #FFFFFF;
}
.task_page .gantt_modal .button_area .button.delete:hover {
  background-color: #d75b5b;
  color: #FFFFFF;
}
.task_page .gantt_modal .button_area .button.delete:focus {
  outline: none;
}
.task_page .gantt_modal .button_area .button.delete:disabled {
  cursor: not-allowed;
}
.task_page .gantt_modal .button_area .button.cancel {
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  color: #656E73;
}
.task_page .gantt_modal .button_area .button.cancel:hover {
  background-color: #92999E;
  color: #FFFFFF;
}
.task_page .gantt_modal .button_area .button.cancel:disabled {
  cursor: not-allowed;
  opacity: 0.65;
}
.task_page .gantt_modal .button_area .button.cancel:disabled:hover {
  background-color: #FFFFFF;
  color: #656E73;
}
.task_page .order_table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}
.task_page .order_table thead tr th {
  border-bottom: 1px solid gray;
  padding: 12px;
}
.task_page .order_table tbody tr {
  transition: background 0.2s ease, opacity 0.2s ease;
  background: #fff;
}
.task_page .order_table tbody tr.is-selected {
  background: #f0f8ff;
}
.task_page .order_table tbody tr.is-dragging {
  opacity: 0.6;
}
.task_page .order_table tbody tr td {
  border-bottom: 1px solid gray;
  padding: 12px;
  vertical-align: middle;
}
.task_page .order_table tbody tr td.drag-handle {
  cursor: grab;
}
.task_page .order_table tbody tr td.drag-handle .icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.task_page .order_table tbody tr td .project-title {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .order_table tbody tr td .color-circle {
  width: 16px;
  height: 16px;
  border-radius: 50%;
}
.task_page .order_table tbody tr td .completed {
  display: flex;
  align-items: center;
  margin-left: 4px;
  padding: 4px 8px;
  background-color: #008800;
  color: #ffffff;
  font-size: 10px;
}
.task_page .drag-overlay {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  position: relative;
  width: 75%;
}
.task_page .drag-overlay .overlay-count {
  position: absolute;
  top: -10px;
  left: 100%;
  transform: translateX(-50%);
  min-width: 24px;
  height: 24px;
  padding: 0 6px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #3b82f6;
  color: #fff;
  font-weight: 600;
  border: 2px solid #fff;
}
.task_page .drag-overlay .overlay-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
}
.task_page .drag-overlay .overlay-row .color-circle {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  margin-right: 6px;
}
.task_page .company_service_name_table {
  color: #4372ba;
  text-align: center;
}
.task_page .company_service_name_table .row_head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: bold;
}
.task_page .company_service_name_table .row_head > div {
  padding: 8px;
  border-bottom: 1px solid #4372ba;
}
.task_page .company_service_name_table .row_head > div:nth-of-type(1), .task_page .company_service_name_table .row_head > div:nth-of-type(2) {
  width: 50px;
  border-bottom: none;
  white-space: nowrap;
}
.task_page .company_service_name_table .row_head > div:nth-of-type(3) {
  width: calc(40% - 49.3333333333px);
}
.task_page .company_service_name_table .row_head > div:nth-of-type(4) {
  width: calc(40% - 49.3333333333px);
}
.task_page .company_service_name_table .row_head > div:nth-of-type(5) {
  width: calc(20% - 49.3333333333px);
}
.task_page .company_service_name_table .row {
  display: flex;
  gap: 8px;
  font-weight: bold;
  font-size: 14px;
  position: relative;
}
.task_page .company_service_name_table .row > div {
  padding: 12px 0px;
  border-bottom: 1px solid #4372ba;
  display: flex;
  align-items: center;
  justify-content: center;
}
.task_page .company_service_name_table .row > div:nth-of-type(1), .task_page .company_service_name_table .row > div:nth-of-type(2) {
  width: 50px;
  border-bottom: none;
  font-size: 26px;
}
.task_page .company_service_name_table .row > div:nth-of-type(3) {
  width: calc(40% - 49.3333333333px);
  justify-content: left;
  padding: 12px;
}
.task_page .company_service_name_table .row > div:nth-of-type(4) {
  width: calc(40% - 49.3333333333px);
  justify-content: left;
  font-weight: initial;
  padding: 12px;
}
.task_page .company_service_name_table .row > div:nth-of-type(5) {
  width: calc(20% - 49.3333333333px);
  justify-content: right;
  padding: 12px;
}
.task_page .company_service_name_table .row.modified {
  background-image: repeating-linear-gradient(-60deg, #fa0000, #fa0000 3px, transparent 3px, transparent 7px, #fa0000 7px), repeating-linear-gradient(30deg, #fa0000, #fa0000 3px, transparent 3px, transparent 7px, #fa0000 7px), repeating-linear-gradient(120deg, #fa0000, #fa0000 3px, transparent 3px, transparent 7px, #fa0000 7px), repeating-linear-gradient(210deg, #fa0000, #fa0000 3px, transparent 3px, transparent 7px, #fa0000 7px);
  background-size: 2px calc(100% + 14px), calc(100% + 14px) 2px, 2px calc(100% + 14px), calc(100% + 14px) 2px;
  background-position: 0 0, 0 0, 100% 0, 0 100%;
  background-repeat: no-repeat;
  animation: borderAnimation 0.5s infinite linear;
  background-color: #fff0f0;
}
.task_page .company_service_name_table .row_foot {
  display: flex;
  align-items: center;
  gap: 24px;
  font-weight: bold;
  margin-top: 16px;
}
.task_page .company_service_name_table .row_foot > div:nth-of-type(1) {
  width: 40px;
  font-size: 26px;
  position: relative;
}
.task_page .company_service_name_table .row_foot > div:nth-of-type(2) {
  width: calc(100% - 64px);
  padding: 8px 0px;
}
.task_page .company_service_name_table .row_foot > div:nth-of-type(2) button {
  border: 1px dashed #4572ba;
  border-radius: 20px;
  padding: 8px;
  text-align: center;
  color: #4572ba;
  font-size: 14px;
  background-color: #f2f2f2;
  width: 100%;
}
.task_page .header_search_area {
  padding: 8px;
  margin-bottom: 16px;
  display: flex;
  justify-content: right;
  align-items: center;
  gap: 16px;
}
.task_page .header_search_area .detail {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .header_search_area .detail .toggle_area {
  display: flex;
  align-items: center;
}
.task_page .header_search_area .detail .toggle_area button {
  border: solid 1px #999999;
  padding: 4px 8px;
}
.task_page .header_search_area .detail .toggle_area button:not(:first-of-type) {
  margin-left: -1px;
}
.task_page .header_search_area .detail .toggle_area button:first-of-type {
  border-radius: 4px 0 0 4px;
}
.task_page .header_search_area .detail .toggle_area button:last-of-type {
  border-radius: 0 4px 4px 0;
}
.task_page .header_search_area .detail .toggle_area button.on {
  background-color: #007916;
  color: #FFFFFF;
}
.task_page .header_search_area .detail .toggle_area button.off {
  background-color: #EEEEEE;
  color: #666666;
}
.task_page .header_multi_select_area {
  border: solid 1px #027916;
  background-color: #f0fff8;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 40px;
  color: #027916;
  margin-bottom: 16px;
  position: fixed;
  z-index: 2000;
  width: calc(100% - 80px);
  top: 50px;
  left: 80px;
}
.task_page .header_multi_select_area .summary_area {
  display: flex;
  align-items: baseline;
  gap: 2px;
}
.task_page .header_multi_select_area .summary_area .num {
  font-size: 20px;
  font-weight: bold;
  color: #027916;
}
.task_page .header_multi_select_area .summary_area button {
  border: solid 1px #CCCCCC;
  border-radius: 4px;
  background-color: #EEEEEE;
  color: #666666;
  padding: 2px 4px;
  font-size: 10px;
}
.task_page .header_multi_select_area .summary_area button:hover {
  opacity: 0.8;
}
.task_page .header_multi_select_area .control_area {
  display: flex;
  align-items: center;
  gap: 8px;
}
.task_page .header_multi_select_area .control_area .button_area {
  display: flex;
  align-items: center;
  gap: 8px;
  border: solid 1px #CCCCCC;
  background-color: #FAFAFA;
  padding: 4px 8px;
}
.task_page .header_multi_select_area .control_area .button_area button {
  border-radius: 4px;
  color: #FFFFFF;
}
.task_page .header_multi_select_area .control_area .button_area button.update {
  background-color: #4371ba;
}
.task_page .header_multi_select_area .control_area .button_area button.target {
  background-color: #027916;
}
.task_page .header_multi_select_area .control_area .button_area button.no_target {
  background-color: #999999;
}
.task_page .header_multi_select_area .control_area .button_area button:hover {
  opacity: 0.8;
}
.task_page .labeling_legend_area {
  position: absolute;
  top: 2px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .labeling_legend_area .timeline_legend {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task_page .labeling_legend_area .timeline_legend .legend_color {
  width: 12px;
  height: 12px;
}
.task_page .labeling_legend_area .timeline_legend .legend_text {
  font-size: 10px;
}

.wrapper.open .header_multi_select_area {
  left: 300px;
  width: calc(100% - 300px);
}

.search_page .help {
  position: relative;
}
.search_page .help .icon {
  margin-left: 4px;
}
.search_page .tips {
  position: relative;
}
.search_page .tip_wrap {
  position: absolute;
  left: 50%;
  top: -10px;
  transform: translateY(-120%) translateX(-50%);
  background-color: #FFFFFF;
  color: #666666;
  padding: 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: initial;
  border: solid 1px #666666;
}
.search_page .tip_wrap .tip {
  position: relative;
  white-space: nowrap;
}
.search_page .tip_wrap .tip::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #FFFFFF;
  position: absolute;
  bottom: -17px;
  left: 50%;
  margin: auto;
  transform: rotate(45deg) translateX(-50%);
  z-index: 0;
  border-bottom: solid 1px #666666;
  border-right: solid 1px #666666;
}
.search_page .tips:hover .tip_wrap {
  display: block;
}
.search_page .search_condition {
  margin-bottom: 8px;
  position: relative;
  background-color: #ffffff;
  color: #666666;
  padding: 16px;
  box-shadow: #cccccc 0px 0px 4px;
}
.search_page .sticky_header .sticky_header_title {
  padding: 0px 4px;
  margin-bottom: 16px;
  font-size: 20px;
}
.search_page .search_condition_title {
  padding: 0px 4px;
  margin-bottom: 8px;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.search_page .search_box {
  padding: 16px;
  position: absolute;
  right: unset;
  top: 30px;
  display: block;
  border: 1px solid #cccccc;
  color: #666666;
  background-color: #FFFFFF;
  box-shadow: 0px 3px 6px #00000029;
  border-radius: 8px;
  z-index: 2110;
}
.search_page .search_box.none {
  display: none;
}
.search_page .search_box .search_detail {
  width: 400px;
  max-height: 300px;
  overflow: auto;
  scrollbar-width: none;
}
.search_page .search_box .search_detail::-webkit-scrollbar {
  display: none;
}
.search_page .search_box .search_detail .category {
  margin-bottom: 16px;
}
.search_page .search_box .search_detail .category .category_title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  padding: 8px 4px;
  border-bottom: 1px solid #cccccc;
  margin-bottom: 8px;
}
.search_page .search_box .search_detail .category .category_title .select_reset {
  font-size: 10px;
  cursor: pointer;
  color: #4572BA;
}
.search_page .search_box .search_detail .category .search_area {
  position: relative;
  width: 100%;
  margin-bottom: 8px;
  background-color: #FFFFFF;
  border: solid 1px #CCCCCC;
  padding: 0 8px;
  border-radius: 4px;
  font-size: 12px;
  display: flex;
  align-items: center;
}
.search_page .search_box .search_detail .category .search_area .icon {
  margin-right: 8px;
}
.search_page .search_box .search_detail .category .search_area input[type=text] {
  width: 100%;
  font-size: 12px;
  border: none;
  background-color: transparent;
}
.search_page .search_box .search_detail .category .search_area .reset {
  padding: 4px;
}
.search_page .search_box .search_detail .category button.chip {
  background: #FFFFFF;
  border: solid 1px #CCCCCC;
  padding: 8px 10px;
  color: #333333;
  border-radius: 30px;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.search_page .search_box .search_detail .category button.chip.checked {
  color: #00a012;
  background-color: #e0f4e2;
}
.search_page .search_box .search_detail .category label {
  display: flex;
  align-items: center;
  margin: 8px 4px;
}
.search_page .search_box .search_detail .category label input[type=checkbox] {
  margin-right: 4px;
}

.member_select_box {
  border: 1px solid #cccccc;
  border-radius: 4px;
  background-color: #ffffff;
  padding: 10px 24px;
  font-size: 14px;
  outline: none;
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.member_select_box:hover {
  background-color: inherit;
}
.member_select_box select {
  cursor: pointer;
}

.task_status_legend {
  padding-left: 24px;
  display: flex;
  justify-content: space-between;
  text-align: center;
  gap: 16px;
  position: absolute;
  bottom: 1px;
  right: 0;
  transform: translateX(100%);
}
.task_status_legend > div {
  font-size: 10px;
  color: #34865f;
  display: flex;
  align-items: flex-end;
  gap: 4px;
  white-space: nowrap;
}
.task_status_legend > div > div {
  width: 30px;
  height: 14px;
  margin: auto;
  background: #34865f;
}
.task_status_legend > div:nth-of-type(2) {
  color: #C61616;
}
.task_status_legend > div:nth-of-type(2) > div {
  background: #C61616;
}
.task_status_legend > div:nth-of-type(3) {
  color: #b2b1b1;
}
.task_status_legend > div:nth-of-type(3) > div {
  background: #b2b1b1;
}

.task_status .modal_body .item .detail {
  position: relative;
  min-height: 50px;
}
.task_status .calendar_box {
  right: unset;
  left: 0;
  top: -250px;
}

.export_page .card_frame {
  display: flex;
  align-items: start;
  flex-flow: wrap;
  gap: 8px;
}
.export_page .card_frame .card {
  width: calc(33.3333333333% - 8px);
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
  cursor: pointer;
  position: relative;
}
.export_page .card_frame .card .detail_area {
  width: 100%;
  margin-bottom: 24px;
}
.export_page .card_frame .card .detail_area .title {
  font-size: 20px;
  font-weight: bold;
  margin: 16px 0px;
  text-align: center;
}
.export_page .card_frame .card .detail_area .text {
  text-align: center;
  color: #666666;
}
.export_page .card_frame .card .image_area {
  width: 100%;
  display: flex;
  align-items: center;
}
.export_page .card_frame .card .image_area img {
  width: 100%;
  margin: auto;
  border-radius: 5px;
  border: solid 1px #CCC;
}
.export_page .card_frame .card:hover {
  opacity: 0.7;
}
.export_page .add_button {
  background-color: #d5e8d4;
  color: #82b366;
  border-radius: 20px;
  padding: 8px 8px;
  display: inline-block;
  cursor: pointer;
  position: relative;
}
.export_page .search_box {
  padding: 16px;
  position: absolute;
  top: 30px;
  display: block;
  border: 1px solid #cccccc;
  color: #666666;
  background-color: #FFFFFF;
  box-shadow: 0px 3px 6px #00000029;
  border-radius: 8px;
  z-index: 2110;
}
.export_page .search_box.none {
  display: none;
}
.export_page .search_box .search_detail {
  width: 400px;
  max-height: 300px;
  overflow: auto;
  scrollbar-width: none;
}
.export_page .search_box .search_detail::-webkit-scrollbar {
  display: none;
}
.export_page .search_box .search_detail .category {
  margin-bottom: 16px;
}
.export_page .search_box .search_detail .category .category_title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  padding: 8px 4px;
  border-bottom: 1px solid #cccccc;
  margin-bottom: 8px;
}
.export_page .search_box .search_detail .category .category_title .select_reset {
  font-size: 10px;
  cursor: pointer;
  color: #4572BA;
}
.export_page .search_box .search_detail .category .search_area {
  position: relative;
  width: 100%;
  margin-bottom: 8px;
  background-color: #FFFFFF;
  border: solid 1px #CCCCCC;
  padding: 0 8px;
  border-radius: 4px;
  font-size: 12px;
  display: flex;
  align-items: center;
}
.export_page .search_box .search_detail .category .search_area .icon {
  margin-right: 8px;
}
.export_page .search_box .search_detail .category .search_area input[type=text] {
  width: 100%;
  font-size: 12px;
  border: none;
  background-color: transparent;
}
.export_page .search_box .search_detail .category .search_area .reset {
  padding: 4px;
}
.export_page .search_box .search_detail .category button.chip {
  background: #FFFFFF;
  border: solid 1px #CCCCCC;
  padding: 4px 8px;
  color: #333333;
  border-radius: 30px;
  margin: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.export_page .search_box .search_detail .category button.chip.checked {
  color: #00a012;
  background-color: #e0f4e2;
}
.export_page .search_box .search_detail .category label {
  display: flex;
  align-items: center;
  margin: 8px 4px;
}
.export_page .search_box .search_detail .category label input[type=checkbox] {
  margin-right: 4px;
}
.export_page .modal_body {
  padding: 32px;
  max-height: unset;
  overflow: unset;
}
.export_page .modal_body fieldset {
  border: solid 1px #999999;
  border-radius: 4px;
  padding: 24px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}
.export_page .modal_body fieldset legend {
  font-size: 14px;
  font-weight: bold;
  padding: 0 8px;
  color: #666666;
}
.export_page .modal_body fieldset .item {
  width: 100%;
}
.export_page .modal_body fieldset .item:last-of-type {
  margin-bottom: 0;
}
.export_page .modal_body .team_select {
  display: flex;
  align-items: center;
  gap: 16px;
}
.export_page .modal_body .team_select .toggle_area {
  border: solid 1px #CCCCCC;
  border-radius: 4px;
}
.export_page .modal_body .team_select .toggle_area > button {
  padding: 4px 8px;
  font-size: 10px;
  font-weight: normal;
  background-color: #EEEEEE;
  color: #999999;
}
.export_page .modal_body .team_select .toggle_area > button.on {
  background-color: #4472ba;
  color: #FFFFFF;
}
.export_page .modal_body .team_select .toggle_area > button:nth-of-type(1) {
  border-radius: 3px 0 0 3px;
}
.export_page .modal_body .team_select .toggle_area > button:last-of-type {
  border-radius: 0 3px 3px 0;
}
.export_page .modal_body .team_select .toggle_area > button:hover {
  opacity: 0.8;
}
.export_page .modal_body hr {
  margin-bottom: 16px;
  border-top: solid 1px #EEEEEE;
}

.risk_page .help .icon {
  margin-left: 4px;
}
.risk_page .help.inner_graph {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100%;
}
.risk_page .help.inner_graph .tip_wrap {
  text-align: center;
}
.risk_page .tips {
  position: relative;
}
.risk_page .tip_wrap {
  position: absolute;
  left: 50%;
  top: -10px;
  transform: translateY(-120%) translateX(-50%);
  background-color: #FFFFFF;
  color: #666666;
  padding: 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: initial;
  border: solid 1px #666666;
  z-index: 1999;
}
.risk_page .tip_wrap .tip {
  position: relative;
  white-space: nowrap;
}
.risk_page .tip_wrap .tip::before {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #FFFFFF;
  position: absolute;
  bottom: -17px;
  left: 50%;
  margin: auto;
  transform: rotate(45deg) translateX(-50%);
  z-index: 0;
  border-bottom: solid 1px #666666;
  border-right: solid 1px #666666;
}
.risk_page .tip_wrap .tip div:not(:last-of-type) {
  margin-bottom: 8px;
}
.risk_page .tips:hover .tip_wrap {
  display: block;
}
.risk_page input[name=tab_item] {
  display: none;
}
.risk_page div.tabs {
  text-align: center;
  background: rgba(51, 51, 51, 0.1);
  box-shadow: inset 0px 0px 6px rgba(51, 51, 51, 0.25);
  border-radius: 30px;
  width: 30%;
  height: 45px;
  margin: auto;
}
.risk_page .tab_item {
  padding: 0.5em;
  margin-top: 0.5em;
  font-size: 14px;
  text-align: center;
  color: #333;
  display: inline-block;
  font-weight: bold;
  transition: 0.1s;
  cursor: pointer;
}
.risk_page .tab_item_visible {
  margin-top: 0.5em;
  background: #094e8d;
  border-radius: 30px;
  color: #FFFFFF;
  padding: 0.5em;
}
.risk_page .tab_content {
  display: none;
}
.risk_page .calendar_button_area {
  border-top: 1px solid #CCCCCC;
  padding: 24px 24px 16px;
  margin-top: 8px;
  display: flex;
  justify-content: flex-end;
}
.risk_page .calendar_button_area button {
  border-radius: 4px;
  padding: 8px 16px;
}
.risk_page .calendar_button_area button.submit_button {
  background-color: #4572BA;
  color: #FFFFFF;
}
.risk_page .calendar_button_area button.submit_button:hover {
  background-color: #094E8D;
}
.risk_page .calendar_button_area button.cancel_button {
  background-color: #FFFFFF;
  border: 1px solid #656E73;
  margin-right: 8px;
}
.risk_page .calendar_button_area button.cancel_button:hover {
  background-color: #656E73;
  color: #FFFFFF;
}
.risk_page .calendar_quick {
  border-top: 1px solid #CCCCCC;
  padding: 24px 24px 16px;
  margin-top: 8px;
}
.risk_page .calendar_quick .text {
  margin-bottom: 16px;
  font-weight: bold;
}
.risk_page .calendar_quick .field .button {
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  padding: 8px 16px;
  margin: 0 4px;
}
.risk_page .calendar_quick .field .button:hover {
  background-color: #ECF0F5;
}
.risk_page .calendar_range {
  display: flex;
  background-color: #c8d5e8;
  padding: 4px 2px;
  border-radius: 6px;
  z-index: 1009;
}
.risk_page .calendar_range button {
  padding: 8px 24px;
  margin: 0 4px;
  border-radius: 6px;
  border: none;
  background: transparent;
}
.risk_page .calendar_range button.selected {
  background-color: #4572BA;
  color: #FFFFFF;
}
.risk_page .calendar_range .calender_switch {
  width: 100%;
  position: absolute;
  height: 36px;
  top: 0;
  left: 0;
  display: none;
}
.risk_page .calendar_range .calender_switch.display {
  display: block;
}
.risk_page .category_label {
  width: 240px;
  border-radius: 4px;
  text-align: center;
  border-width: 1px;
  border-style: solid;
  border-color: rgba(var(--color), var(--alpha));
  margin-top: 8px;
  margin-bottom: 8px;
  margin-right: 8px;
}
.risk_page .category_label .title {
  padding: 8px;
  font-weight: bold;
  border-radius: 3px 3px 0px 0px;
  line-height: 22px;
  background-color: rgba(var(--color), var(--alpha));
  color: rgba(var(--color), 1);
}
.risk_page .category_label .title img {
  vertical-align: middle;
  margin-right: 8px;
}
.risk_page .category_label .title.title_label {
  border-radius: 3px;
}
.risk_page .category_label .detail {
  padding: 8px;
  font-size: 14px;
  font-weight: bold;
  border-radius: 0px 0px 3px 3px;
  background-color: #ffffff;
}
.risk_page .flex {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  position: relative;
}
.risk_page .flex.center {
  align-items: center;
}
.risk_page .profile_icon {
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin-right: 10px;
}
.risk_page .filter_button {
  padding: 4px 8px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  min-width: 120px;
  display: flex;
  align-items: center;
  color: #666666;
  background-color: #FFFFFF;
}
.risk_page .filter_button:hover {
  color: #4a7ecd;
  background-color: #FFFFFF;
}
.risk_page .filter_button .icon {
  margin-right: 8px;
  width: 18px;
  height: 18px;
  padding: 4px 0 4px 4px;
}
.risk_page .content-title-row {
  display: flex;
  align-items: flex-end;
}
.risk_page .content-title {
  text-align: center;
  padding-top: 20px;
  color: #333333;
  font-size: 32px;
}
.risk_page .dashboard-search-section {
  padding: 0 0 10px;
  margin: 0;
  position: relative;
  height: auto;
  overflow: visible;
}
.risk_page .dashboard-search-section .chip {
  display: inline-block;
  position: relative;
  background-color: #ECF0F5;
  padding: 4px 8px 4px 8px;
  border-radius: 16px;
  margin: 2px 4px;
  font-size: 12px;
  z-index: 1220;
}
.risk_page .dashboard-search-section .chip .icon {
  margin-left: 8px;
}
.risk_page .dashboard-search-section .header_area {
  display: flex;
  align-items: center;
  justify-content: center;
}
.risk_page .dashboard-search-section .header_area .header_title {
  font-size: 20px;
  font-weight: bold;
  margin-right: 16px;
  min-width: 80px;
}
.risk_page .dashboard-search-section .header_area .search_conditions {
  display: inline;
}
.risk_page .dashboard-search-section .header_area .search_conditions .title {
  display: inline;
  color: #999999;
  margin: 0 8px;
}
.risk_page .dashboard-search-section .header_area .search_conditions .chip {
  color: #4a7ecd;
  background-color: #CAD6EA;
}
.risk_page .dashboard-search-section .header_area .search_conditions .chip .icon {
  margin-top: 2px;
}
.risk_page .dashboard-search-section .contents_area {
  margin-top: 0;
  border-radius: 8px;
  background: #FFFFFF;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  max-height: 0;
  opacity: 0;
  transition: 0.3s linear;
}
.risk_page .dashboard-search-section .contents_area.open {
  max-height: 100vh;
  opacity: 1;
  transition: 0.3s ease-in-out;
}
.risk_page .dashboard-search-section .contents_area .conditions_area {
  padding: 16px;
  border-bottom: 1px solid #CCCCCC;
  display: flex;
  justify-content: space-around;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item {
  width: 23%;
  position: relative;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .conditions_title {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 8px;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .conditions_title .reset {
  font-size: 10px;
  cursor: pointer;
  color: #4572BA;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item select {
  width: 100%;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .selected_item {
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  padding: 6px 8px;
  min-height: 44px;
  position: relative;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .selected_item .modal_trigger {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: -6px -8px;
  z-index: 1;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .selected_item > .icon {
  position: absolute;
  right: 10px;
  top: calc(50% - 6px);
  z-index: 0;
  transition: transform 0.3s ease;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .selected_item > .icon.open {
  transform: rotate(180deg);
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .select_box {
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  padding: 16px;
  z-index: 1210;
  position: absolute;
  width: 100%;
  background-color: #FFFFFF;
  margin-top: 8px;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .select_box.none {
  display: none;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .select_box .search_area {
  position: relative;
  width: 100%;
  margin-bottom: 16px;
  background-color: #EEE;
  border: none;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  display: flex;
  align-items: center;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .select_box .search_area > .icon {
  margin-right: 8px;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .select_box .search_area input[type=text] {
  border: none;
  background-color: transparent;
  width: 100%;
  line-height: 1.4em;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .select_box .search_area input[type=text]:focus {
  outline: none;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .select_box .search_area .reset {
  position: absolute;
  right: 0;
  border: none;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .select_box .select_list {
  max-height: 250px;
  overflow: scroll;
  overflow-y: auto;
  overflow-x: unset;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .select_box .select_row {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .select_box .select_row input[type=checkbox] {
  width: 18px;
  height: 18px;
  margin: 0 4px 0 0;
  border: 1px solid #CCC;
}
.risk_page .dashboard-search-section .contents_area .conditions_area .conditions_item .select_box .select_row label {
  font-weight: normal;
}
.risk_page .dashboard-search-section .contents_area .button_area {
  padding: 16px 30px;
  text-align: right;
}
.risk_page .dashboard-search-section .contents_area .button_area button {
  width: auto;
  height: auto;
  border-radius: 4px;
  min-width: 160px;
  text-align: center;
}
.risk_page .dashboard-search-section .contents_area .button_area button.cancel {
  border: 1px solid #CCCCCC;
  margin-right: 16px;
  background-color: #FFFFFF;
}
.risk_page .dashboard-search-section .contents_area .button_area button.cancel:hover {
  background-color: #656E73;
  color: #FFFFFF;
}
.risk_page .dashboard-search-section .contents_area .button_area button.submit {
  border: 1px solid #4572BA;
  background-color: #4572BA;
  color: #FFFFFF;
}
.risk_page .dashboard-search-section .contents_area .button_area button.submit:hover {
  background-color: #0A4E8D;
}
.risk_page .dashboard-search-section .dashboard_screen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1200;
}
.risk_page .dashboard-search-section .dashboard_screen.none {
  z-index: -1;
}
.risk_page .box {
  position: relative;
  border-radius: 3px;
  background: #ffffff;
  margin-bottom: 20px;
  width: 100%;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  padding: 16px;
}
.risk_page .box.summary .summary_title {
  font-size: 24px;
  margin-bottom: 24px;
  text-align: center;
  font-weight: bold;
  color: #094e8d;
}
.risk_page .box.summary .category_title_area {
  margin: 0px 16px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.risk_page .box.summary .category_title_area .category_title {
  font-size: 18px;
  font-weight: bold;
  color: #094e8d;
}
.risk_page .box.summary .category_title_area .switch_area {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 8px 12px;
  border-radius: 20px;
  background-color: #e5e5e5;
  font-size: 12px;
}
.risk_page .box.summary .category_title_area .switch_area button {
  padding: 4px 8px;
  border-radius: 20px;
  background-color: #ffffff;
  color: #666666;
}
.risk_page .box.summary .category_title_area .switch_area button.select {
  background-color: #094f8c;
  color: #ffffff;
}
.risk_page .box.summary .list_area {
  margin: 0px 16px;
  border: 2px solid #4372ba;
  border-radius: 4px;
  padding: 16px;
}
.risk_page .box.summary .list_area .legend_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.risk_page .box.summary .list_area .legend_area .legend {
  display: flex;
  align-items: center;
  gap: 2px;
  cursor: pointer;
}
.risk_page .box.summary .list_area .legend_area .legend .color_box {
  width: 16px;
  height: 16px;
}
.risk_page .box.summary .list_area .list_row {
  display: flex;
  align-items: center;
  margin: 16px 0px;
}
.risk_page .box.summary .list_area .list_row .name_area {
  width: 20%;
  font-size: 16px;
  font-weight: bold;
  display: flex;
  align-items: center;
}
.risk_page .box.summary .list_area .list_row .name_area.transparent {
  opacity: 0.2;
}
.risk_page .box.summary .list_area .list_row .graph_area {
  display: flex;
  width: 80%;
  height: 40px;
}
.risk_page .box.summary .list_area .list_row .graph_area .graph_wrap {
  display: flex;
}
.risk_page .box.summary .list_area .list_row .graph_area .graph_wrap .graph_detail {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: default;
  position: relative;
}
.risk_page .box.summary .list_area .list_row .graph_area .graph_wrap .graph_detail.transparent {
  opacity: 0.2;
}
.risk_page .box.summary .list_area .list_row .graph_area .graph_wrap .graph_detail .graph_text {
  filter: invert(100%) grayscale(100%) contrast(100);
  font-size: 16px;
  text-align: center;
}
.risk_page .box.summary .list_area .ruler_area {
  width: 80%;
  position: relative;
  height: 8px;
  border-top: 1px solid #999999;
  color: #999999;
  margin-left: 20%;
}
.risk_page .box.summary .list_area .ruler_area .scale_area {
  position: absolute;
  transform: translateX(-50%);
}
.risk_page .box.summary .list_area .ruler_area .scale_area .scale {
  position: absolute;
  top: -8px;
  left: 50%;
  height: 8px;
  width: 1px;
  background-color: #999999;
}
.risk_page .summary_block {
  display: flex;
  margin-bottom: 40px;
  margin-top: 40px;
  gap: 80px;
  padding: 0px 16px 0px 40px;
}
.risk_page .summary_block .ranking_block {
  border: 2px solid #4372ba;
  border-radius: 4px;
  padding: 16px;
  display: flex;
  flex-flow: column;
}
.risk_page .summary_block .ranking_block .ranking_title {
  width: 100%;
  font-size: 16px;
  font-weight: bold;
  color: #666666;
  margin: 8px 0px 24px;
}
.risk_page .summary_block .ranking_block .ranking_rows {
  max-height: 250px;
  overflow-y: auto;
  display: flex;
  flex-flow: column;
}
.risk_page .summary_block .ranking_block .ranking_rows .ranking_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: #666666;
  margin: 8px 0px;
  min-height: 24px;
}
.risk_page .summary_block .ranking_block .ranking_rows .ranking_row .ranking_title_area {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: bold;
}
.risk_page .summary_block .ranking_block .ranking_rows .ranking_row .ranking_title_area .icon_area {
  width: 40px;
  display: flex;
  justify-content: center;
  font-size: 20px;
  color: #999999;
}
.risk_page .summary_block .ranking_block .ranking_rows .ranking_row .ranking_title_area .text_area {
  display: flex;
  align-items: center;
  gap: 8px;
}
.risk_page .summary_block .ranking_block .ranking_rows .ranking_row .ranking_title_area .text_area .icon {
  width: 24px;
  height: 24px;
  min-width: 16px;
  min-height: 16px;
  border-radius: 50%;
}
.risk_page .summary_block .ranking_block .ranking_rows .ranking_row .detail_area {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: bold;
  white-space: nowrap;
}
.risk_page .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(1) .ranking_title_area {
  font-size: 18px;
}
.risk_page .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(1) .ranking_title_area .icon_area {
  font-size: 30px;
  color: #cfca04;
}
.risk_page .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(1) .detail_area {
  font-size: 18px;
}
.risk_page .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(2) .ranking_title_area .icon_area {
  font-size: 20px;
  color: #c0c0c0;
}
.risk_page .summary_block .ranking_block .ranking_rows .ranking_row:nth-of-type(3) .ranking_title_area .icon_area {
  font-size: 20px;
  color: #c58204;
}
.risk_page .summary_block .ranking_block .no_data {
  font-size: 24px;
  font-weight: bold;
  color: #999999;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.risk_page .error_box {
  margin-left: 0.5em;
  margin-right: 0.5em;
  color: #ff0000;
  text-align: center;
  border: 1px solid #ff0000;
  border-radius: 4px;
  background-color: #ffecec;
  padding: 8px;
  margin-bottom: 20px;
}
.risk_page .analyse_title {
  margin-bottom: 16px;
  font-size: 24px;
  font-weight: bold;
  color: #094E8D;
}
.risk_page .analyse_text_area {
  font-size: 14px;
  line-height: 1.8em;
}
.risk_page .user_data_table {
  width: 100%;
}
.risk_page .user_data_table .table-header {
  width: 20%;
  padding-left: 8px;
  padding-bottom: 8px;
  padding-top: 8px;
  font-size: 14px;
  font-weight: bold;
  color: rgba(51, 51, 51, 0.85);
}
.risk_page .user_data_table .table-header:last-child {
  width: 20%;
}
.risk_page .user_data_table .table-header .info_icon {
  margin-left: 4px;
  vertical-align: text-top;
  color: #094e8d;
}
.risk_page .user_data_table thead tr {
  border-bottom: 1px solid #F5F5F5;
}
.risk_page .user_data_table tr {
  background-color: #FFFFFF;
  display: flex;
  align-items: center;
}
.risk_page .user_data_table tr:nth-child(even) {
  background-color: #F5F5F5;
}
.risk_page .user_data_table .table-body {
  width: 20%;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left: 8px;
  padding-right: 8px;
}
.risk_page .user_data_table .table-body .past_text {
  font-size: 14px;
  color: #cccccc;
}
.risk_page .user_data_table .table-body .information {
  display: table;
  line-height: 26px;
}
.risk_page .user_data_table .table-body .information .text {
  display: table-cell;
  font-size: 14px;
  color: #cccccc;
  vertical-align: middle;
}
.risk_page .user_data_table .table-body .information [class^=compare] + .text {
  padding-left: 8px;
}
.risk_page .user_data_table .table-body .information[lang=en] {
  margin-top: 10px;
  margin-bottom: 18px;
}
.risk_page .user_data_table .table-body .value {
  line-height: 30px;
  margin-top: 8px;
}
.risk_page .user_data_table .table-body .value .text {
  font-size: 24px;
  font-weight: bold;
}
.risk_page .user_data_table .table-body-name {
  width: 9em;
  margin: 0;
  font-size: 16px;
  font-weight: bold;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  display: flex;
  align-items: center;
}
.risk_page .user_data_table .profile_icon {
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin-right: 10px;
}
.risk_page .paging-box {
  text-align: center;
  background: transparent;
  box-shadow: none;
}
.risk_page .paging {
  display: inline-block;
}
.risk_page .paging > .pagination {
  color: black;
  padding: 8px 16px;
  text-decoration: none;
  border: 1px solid #ddd;
  background-color: #ffffff;
}
.risk_page .paging > .active {
  background-color: #4a7ecd;
  color: white;
}
.risk_page .paging > :hover:not(.active) {
  background-color: #ddd;
}
.risk_page .member-heatmap .heatmap-icons {
  position: absolute;
  top: 30px;
  left: 20px;
  width: 40px;
}
.risk_page .member-heatmap .heatmap-icons > .icon {
  margin-bottom: 1px;
}
.risk_page .member-heatmap .heatmap-icons > .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  height: 36px;
  width: 36px;
}
.risk_page .member-heatmap .heatmap-icons.mini > .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  height: 32.5px;
  width: 32.5px;
}
.risk_page .member-heatmap .heatmap-icons > .icon > svg {
  font-size: 15px;
  line-height: 30px;
  border-radius: 50%;
  height: 24px;
  width: 24px;
}
.risk_page .member-heatmap .heatmap-icons.mini > .icon > svg {
  font-size: 15px;
  line-height: 30px;
  border-radius: 50%;
  height: 20px;
  width: 20px;
}
.risk_page .member-heatmap .heatmap-body {
  padding-top: 0px;
  padding-left: 30px;
  padding-right: 0px;
  padding-bottom: 0px;
}

.promotionModal .header_text {
  text-align: center;
  margin-bottom: 16px;
  color: #ff0000;
  font-size: 16px;
  font-weight: bold;
}
.promotionModal .title {
  color: #4372ba;
  text-align: center;
  font-size: 30px;
  font-weight: bold;
  margin-bottom: 32px;
}
.promotionModal .footer_text {
  margin-top: 40px;
  padding-top: 24px;
  text-align: center;
  border-top: 1px solid #cccccc;
  color: #4372ba;
  font-size: 18px;
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column;
}

.graphical_check_box {
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px 16px;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 16px;
  cursor: pointer;
  background-color: #ffffff;
}
.graphical_check_box.selected {
  background-color: #d9ffdd;
}
.graphical_check_box .icon {
  font-size: 20px;
}
.graphical_check_box .icon.checked {
  color: #08984C;
}
.graphical_check_box .icon.no_check {
  color: #666666;
}
.graphical_check_box .check_box_title {
  font-size: 16px;
  margin-bottom: 8px;
}
.graphical_check_box .check_box_description {
  color: #999999;
}

.user_guide_icon .user_guide_icon_text {
  font-size: 8px;
  text-align: center;
  margin-top: 2px;
}

.user_guide_modal {
  display: flex;
  font-size: initial;
  gap: 20px;
}
.user_guide_modal .navigation_area {
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.user_guide_modal .navigation_area button {
  width: 20px;
  padding: 0px;
  height: 100%;
  text-align: center;
}
.user_guide_modal .navigation_area:hover {
  opacity: 0.8;
}
.user_guide_modal .user_guide_main {
  width: calc(100% - 80px);
  position: relative;
}
.user_guide_modal .user_guide_main .next_filter {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}

.task_administrator_modal .checkbox_area {
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px 16px;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 16px;
  cursor: pointer;
}
.task_administrator_modal .checkbox_area .checkbox {
  font-size: 20px;
}
.task_administrator_modal .checkbox_area .checkbox_area_title {
  font-size: 16px;
  margin-bottom: 8px;
}
.task_administrator_modal .checkbox_area .checkbox_area_description {
  color: #999999;
}
.task_administrator_modal .error_box {
  border: 1px solid #ff0000;
  border-radius: 4px;
  color: #ff0000;
  background-color: #ffecec;
  text-align: center;
  padding: 8px;
}

.approved_modal .select_wrap {
  display: inline-flex;
  align-items: center;
  position: relative;
}
.approved_modal .select_wrap::after {
  position: absolute;
  right: 15px;
  width: 10px;
  height: 7px;
  background-color: #535353;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  content: "";
  pointer-events: none;
}
.approved_modal .select_wrap select {
  appearance: none;
  height: 2.8em;
  padding: 0.4em calc(0.8em + 30px) 0.4em 0.8em;
  border: 1px solid #cccccc;
  border-radius: 3px;
  background-color: #fff;
  color: #333333;
  font-size: 1em;
  cursor: pointer;
}
.approved_modal .approved_modal_header {
  display: flex;
  align-items: center;
  margin-bottom: 24px;
}
.approved_modal .approved_modal_header button {
  border: solid 1px #666666;
  border-radius: 4px;
  color: #666666;
  display: flex;
  align-items: center;
  gap: 4px;
}
.approved_modal .approved_modal_header button:hover {
  background-color: #EEEEEE;
}
.approved_modal .approved_modal_title {
  color: #395f99;
  font-size: 18px;
  text-align: center;
}
.approved_modal .approved_modal_summary_area {
  display: flex;
  align-items: flex-start;
  gap: 40px;
  margin-bottom: 16px;
}
.approved_modal .approved_modal_summary_area .status_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 40px;
}
.approved_modal .approved_modal_summary_area .chart_area {
  position: relative;
}
.approved_modal .approved_modal_summary_area .chart_area .text_area {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: fit-content;
  z-index: 2;
}
.approved_modal .approved_modal_summary_area .chart_area .text_area .text_area_title {
  font-size: 14px;
  text-align: center;
  color: #666666;
  white-space: nowrap;
}
.approved_modal .approved_modal_summary_area .chart_area .text_area .text_area_text {
  font-size: 40px;
  color: #0f9655;
  font-weight: bold;
  text-align: center;
}
.approved_modal .approved_modal_summary_area .chart_button_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  margin: 32px 0px 16px;
}
.approved_modal .approved_modal_summary_area .chart_button_area button {
  font-size: 10px;
  padding: 2px 4px;
  border: 1px solid #999999;
  border-radius: 4px;
  color: #999999;
  background-color: #EEEEEE;
}
.approved_modal .approved_modal_summary_area .chart_button_area button.on {
  color: #666666;
  background-color: #FFFFFF;
}
.approved_modal .approved_modal_summary_area .link_area {
  display: flex;
  justify-content: center;
  margin-top: 16px;
}
.approved_modal .approved_modal_summary_area .data_area {
  width: 100%;
  display: flex;
  flex-flow: column;
  gap: 8px;
  font-size: 14px;
}
.approved_modal .approved_modal_summary_area .data_area .text_area {
  display: flex;
  align-items: center;
  gap: 8px;
}
.approved_modal .approved_modal_summary_area .data_area .text_area .label_chip {
  background-color: #2196f3;
  color: #ffffff;
  font-size: 10px;
  border-radius: 4px;
  padding: 2px 4px;
}
.approved_modal .approved_modal_summary_area .data_area .log_area .log_area_title {
  border: 1px solid #666666;
  padding: 4px;
  font-size: 12px;
  text-align: center;
  background-color: #666666;
  color: #ffffff;
  margin-bottom: -1px;
}
.approved_modal .approved_modal_summary_area .data_area .log_area .log_area_main {
  border: 1px solid #cccccc;
  padding: 8px;
  font-size: 12px;
  color: #666666;
  height: 15em;
  overflow-y: scroll;
  display: flex;
  flex-flow: column;
  gap: 8px;
}
.approved_modal .approved_modal_summary_area .data_area .log_area .log_area_main .log_block {
  padding: 8px 8px 16px;
  border-bottom: 1px dashed #cccccc;
}
.approved_modal .approved_modal_summary_area .data_area .log_area .log_area_main .log_block .log_block_title {
  font-size: 11px;
  color: #999999;
  margin-bottom: 4px;
}
.approved_modal .approved_modal_summary_area .data_area .log_area .log_area_main .log_block .log_block_status {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 8px;
  margin-bottom: 4px;
}
.approved_modal .approved_modal_summary_area .data_area .log_area .log_area_main .no_data {
  padding: 8px 8px 16px;
}
.approved_modal .approved_modal_summary_area .data_area .summary_area {
  border: 1px solid #3f51b5;
  border-radius: 4px;
}
.approved_modal .approved_modal_summary_area .data_area .summary_area .summary_area_title {
  background-color: #3f51b5;
  color: #ffffff;
  border-radius: 2px 2px 0px 0px;
  text-align: center;
  padding: 2px;
  font-size: 12px;
}
.approved_modal .approved_modal_summary_area .data_area .summary_area .summary_area_main {
  padding: 8px;
  display: flex;
  flex-flow: column;
  gap: 8px;
  font-size: 12px;
}
.approved_modal .approved_modal_summary_area .data_area .summary_area .summary_area_main .label_chip_area {
  display: flex;
}
.approved_modal .approved_modal_summary_area .data_area .summary_area .summary_area_main .label_chip_area > div {
  display: flex;
  align-items: flex-end;
  gap: 4px;
}
.approved_modal .approved_modal_summary_area .data_area .summary_area .summary_area_main .label_chip_area > div .label_chip {
  background-color: #000000;
  color: #ffffff;
  border-radius: 4px;
  padding: 2px 4px;
  font-size: 10px;
}
.approved_modal .approved_modal_summary_area .data_area .summary_area .summary_area_main .label_chip_area > div .label_area_value {
  color: #333333;
}
.approved_modal .approved_modal_summary_area .data_area .summary_area .summary_area_main .label_bar {
  border-top: 1px dashed #999999;
}
.approved_modal .flow_area .flow_area_title {
  display: flex;
  align-items: center;
  gap: 4px;
  background-color: #396099;
  color: #ffffff;
  padding: 4px 8px;
  margin-bottom: -1px;
  cursor: pointer;
}
.approved_modal .flow_area .flow_area_main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid #396099;
  padding: 8px 0px;
}
.approved_modal .flow_area .flow_area_main .approver_block {
  border: 1px solid #cccccc;
  border-radius: 4px;
  width: 130px;
  background-color: #ffffff;
}
.approved_modal .flow_area .flow_area_main .approver_block .approver_block_title {
  background-color: #eeeeee;
  padding: 4px;
  border-radius: 4px 4px 0px 0px;
  color: #666666;
  text-align: center;
}
.approved_modal .flow_area .flow_area_main .approver_block .approver_block_name {
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.approved_modal .flow_area .flow_area_main .approver_block .approver_block_name .profile_icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
.approved_modal .flow_area .flow_area_main .approver_block .approver_block_status {
  border-top: 1px dashed #cccccc;
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.approved_modal .application_area {
  border-top: 1px dashed #CCCCCC;
  padding: 16px 0px 0px;
  margin-top: 16px;
}
.approved_modal .application_area .application_area_header {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 2px;
  margin-bottom: 8px;
}
.approved_modal .application_area .application_area_title {
  color: #ffffff;
  padding: 4px 8px;
  margin-bottom: -1px;
}
.approved_modal .application_area .application_area_text {
  border: 1px solid #CCCCCC;
  width: 100%;
  padding: 8px;
  min-height: 9em;
  resize: none;
  outline: none;
}
.approved_modal .error_area {
  text-align: center;
  color: #ff0000;
  border-top: 1px dashed #cccccc;
  padding-top: 16px;
  margin-bottom: 16px;
}
.approved_modal .button_area {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 8px;
}
.approved_modal .button_area button {
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  min-width: 130px;
  text-align: center;
}
.approved_modal .button_area button:hover {
  opacity: 0.8;
}
.approved_modal .approved_modal_label {
  display: flex;
  align-items: center;
  gap: 4px;
  border-radius: 4px;
  padding: 2px 4px;
  font-size: 10px;
}

.approver_setting_modal .description {
  margin-bottom: 8px;
}
.approver_setting_modal .item .detail input[type=text] {
  height: auto;
  padding: 16px;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 4px;
  font-size: 14px;
}
.approver_setting_modal .item .error {
  border: 1px solid #c61616;
  border-radius: 4px;
  background-color: #ffeaea;
  padding: 8px;
  line-height: 1.5em;
  display: flex;
  align-items: center;
  gap: 8px;
}
.approver_setting_modal .item .info_area {
  margin-top: 4px;
  border: 1px solid #305082;
  border-radius: 4px;
  background-color: #ecf3ff;
  color: #305082;
  padding: 8px;
  line-height: 1.5em;
  display: flex;
  align-items: center;
  gap: 8px;
}
.approver_setting_modal fieldset.approver_area_wrapper {
  padding: 16px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  width: 100%;
  margin-bottom: 0px;
}
.approver_setting_modal fieldset.approver_area_wrapper .approver_area {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
}
.approver_setting_modal fieldset.approver_area_wrapper .approver_area .approver_block_wrapper {
  position: relative;
}
.approver_setting_modal fieldset.approver_area_wrapper .approver_area .approver_block_wrapper .delete_approver {
  padding: 0px;
  position: absolute;
  top: 0px;
  right: 21px;
  color: #999999;
  font-size: 10px;
  z-index: 100;
}
.approver_setting_modal fieldset.approver_area_wrapper .approver_area .approver_block_wrapper .approver_select_box_wrapper {
  position: absolute;
  top: 27px;
  left: calc(50% - 9px);
  z-index: 100;
  border: 1px solid #cccccc;
  border-radius: 2px;
  transform: translateX(-50%);
  width: 80%;
  padding: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  cursor: pointer;
  min-height: 26px;
}
.approver_setting_modal fieldset.approver_area_wrapper .approver_area .approver_block_wrapper .approver_select_box_wrapper .profile_icon {
  width: 20px;
  height: 20px;
  border-radius: 50%;
}
.approver_setting_modal fieldset.approver_area_wrapper .approver_area .approver_block_wrapper .approver_block {
  border: 1px solid #cccccc;
  border-radius: 4px;
  min-width: 130px;
  background-color: #ffffff;
  position: relative;
}
.approver_setting_modal fieldset.approver_area_wrapper .approver_area .approver_block_wrapper .approver_block .approver_block_title {
  position: relative;
  background-color: #eeeeee;
  padding: 4px;
  border-radius: 4px 4px 0px 0px;
  color: #666666;
  text-align: center;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}
.approver_setting_modal fieldset.approver_area_wrapper .approver_area .approver_block_wrapper .approver_block .approver_block_title .display_icon {
  position: absolute;
  top: 4px;
  left: 4px;
  color: #cccccc;
}
.approver_setting_modal fieldset.approver_area_wrapper .approver_area .approver_block_wrapper .approver_block .approver_block_main {
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 35px;
}
.approver_setting_modal fieldset.approver_area_wrapper .approver_area .approver_block_wrapper .approver_block .approver_block_main .profile_icon {
  width: 20px;
  height: 20px;
  border-radius: 50%;
}
.approver_setting_modal fieldset.member_area_wrapper {
  padding: 16px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  width: 100%;
  margin-bottom: 0px;
  position: relative;
}
.approver_setting_modal fieldset.member_area_wrapper .member_area {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
}
.approver_setting_modal fieldset.member_area_wrapper .member_area .member_block {
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 20px;
  padding: 4px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.approver_setting_modal fieldset.member_area_wrapper .member_area .member_block .profile_icon {
  border-radius: 50%;
  width: 20px;
}

.approver_setting_modal_for_member .description {
  margin-bottom: 8px;
}
.approver_setting_modal_for_member .custom_select_area {
  position: relative;
}
.approver_setting_modal_for_member .custom_select_area .custom_select {
  height: auto;
  padding: 16px;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 4px;
  font-size: 12px;
}
.approver_setting_modal_for_member .custom_select_area .error {
  border: 1px solid #c61616;
  border-radius: 4px;
  background-color: #ffeaea;
  padding: 8px;
  line-height: 1.5em;
  display: flex;
  align-items: center;
  gap: 8px;
}
.approver_setting_modal_for_member .custom_select_area .custom_select_box {
  position: absolute;
  bottom: 0px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
  display: flex;
  flex-flow: column;
  gap: 8px;
  background-color: #ffffff;
  width: 100%;
  transform: translateY(100%);
  z-index: 2004;
}
.approver_setting_modal_for_member .custom_select_area .custom_select_box .custom_select_box_title {
  font-weight: bold;
}
.approver_setting_modal_for_member .custom_select_area .custom_select_box .custom_select_box_contents {
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 8px;
  display: flex;
  flex-flow: column;
  gap: 8px;
  max-height: 300px;
  overflow-y: scroll;
}
.approver_setting_modal_for_member .custom_select_area .custom_select_box .custom_select_box_contents .custom_select_box_row {
  border: 1px solid #cccccc;
  border-radius: 4px;
  padding: 4px;
  cursor: pointer;
}
.approver_setting_modal_for_member .custom_select_area .custom_select_box .custom_select_box_contents .custom_select_box_row.unset {
  padding: 8px;
  text-align: center;
  background-color: #eeeeee;
  color: #666666;
}
.approver_setting_modal_for_member .custom_select_area .custom_select_box .custom_select_box_contents .custom_select_box_row .custom_select_box_row_title {
  margin-bottom: 4px;
  padding: 4px;
  font-weight: bold;
  border-bottom: 1px dashed #cccccc;
}
.approver_setting_modal_for_member .custom_select_area .custom_select_box .custom_select_box_contents .custom_select_box_row .custom_select_box_row_flow {
  display: flex;
  align-items: center;
  justify-content: left;
  gap: 4px;
  min-height: 50px;
}
.approver_setting_modal_for_member .custom_select_area .custom_select_box .custom_select_box_contents .custom_select_box_row .custom_select_box_row_flow .approver_block {
  border: 1px solid #cccccc;
  border-radius: 4px;
  width: 130px;
  background-color: #ffffff;
}
.approver_setting_modal_for_member .custom_select_area .custom_select_box .custom_select_box_contents .custom_select_box_row .custom_select_box_row_flow .approver_block .approver_block_title {
  background-color: #eeeeee;
  padding: 4px;
  border-radius: 4px 4px 0px 0px;
  color: #666666;
  text-align: center;
}
.approver_setting_modal_for_member .custom_select_area .custom_select_box .custom_select_box_contents .custom_select_box_row .custom_select_box_row_flow .approver_block .approver_block_name {
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.approver_setting_modal_for_member .custom_select_area .custom_select_box .custom_select_box_contents .custom_select_box_row .custom_select_box_row_flow .approver_block .approver_block_name .profile_icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
}

.history_modal .history_modal_title {
  color: #395f99;
  font-size: 18px;
  text-align: center;
  margin-bottom: 24px;
}
.history_modal .history_modal_main {
  padding: 16px 0px 0px;
  margin-top: 16px;
}
.history_modal .history_modal_main .log_area {
  border: 1px solid #cccccc;
  padding: 8px;
  font-size: 12px;
  color: #666666;
  max-height: 400px;
  overflow-y: scroll;
  display: flex;
  flex-flow: column;
  gap: 8px;
}
.history_modal .history_modal_main .log_area .log_block {
  padding: 8px 8px 16px;
  border-bottom: 1px dashed #cccccc;
}
.history_modal .history_modal_main .log_area .log_block .log_block_title {
  font-size: 11px;
  color: #999999;
  margin-bottom: 4px;
}
.history_modal .history_modal_main .log_area .log_block .log_block_status {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 8px;
  margin-bottom: 4px;
}
.history_modal .history_modal_main .log_area .log_block .log_block_status .status_label {
  display: flex;
  align-items: center;
  gap: 4px;
  border-radius: 4px;
  padding: 2px 4px;
  font-size: 10px;
}
.history_modal .history_modal_main .log_area .no_data {
  padding: 8px 8px 16px;
}
.history_modal .history_modal_main .button_area {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 8px;
}
.history_modal .history_modal_main .button_area button {
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  min-width: 130px;
  text-align: center;
}
.history_modal .history_modal_main .button_area button:hover {
  opacity: 0.8;
}

.multi_approved_modal .multi_approved_modal_title {
  color: #395f99;
  font-size: 18px;
  text-align: center;
  margin-bottom: 24px;
}
.multi_approved_modal .multi_approved_modal_main {
  padding: 16px 0px 0px;
  margin-top: 16px;
}
.multi_approved_modal .multi_approved_modal_main .description {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2px;
  margin-bottom: 8px;
}
.multi_approved_modal .multi_approved_modal_main .target_display_area {
  display: flex;
  gap: 8px;
  flex-flow: column;
  border: 1px solid #cccccc;
  padding: 8px;
  margin-bottom: 8px;
}
.multi_approved_modal .multi_approved_modal_main .target_display_area .target_display_area_title {
  border-bottom: 1px dashed #999999;
  padding: 4px 8px;
  font-weight: bold;
}
.multi_approved_modal .multi_approved_modal_main .target_display_area .target_display_area_main {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 8px 4px;
}
.multi_approved_modal .multi_approved_modal_main .target_display_area .target_display_area_main .date {
  border-bottom: 1px solid #999999;
  padding: 0px 8px;
}
.multi_approved_modal .multi_approved_modal_main .application_area_title {
  color: #ffffff;
  padding: 4px 8px;
  margin-bottom: -1px;
}
.multi_approved_modal .multi_approved_modal_main .application_area_text {
  border: 1px solid #CCCCCC;
  width: 100%;
  padding: 8px;
  min-height: 9em;
  resize: none;
  outline: none;
}
.multi_approved_modal .multi_approved_modal_main .button_area {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 32px;
}
.multi_approved_modal .multi_approved_modal_main .button_area button {
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  min-width: 130px;
  text-align: center;
}
.multi_approved_modal .multi_approved_modal_main .button_area button:hover {
  opacity: 0.8;
}

.self-building-square-spinner, .self-building-square-spinner * {
  box-sizing: border-box;
}

.self-building-square-spinner {
  height: 40px;
  width: 40px;
  margin: 24px auto;
}

.self-building-square-spinner .square {
  height: 10px;
  width: 10px;
  top: -6.6666666667px;
  margin-right: 3.3333333333px;
  margin-top: 3.3333333333px;
  background: PowderBlue;
  float: left;
  position: relative;
  opacity: 0;
  animation: self-building-square-spinner 6s infinite;
}

.self-building-square-spinner .square:nth-child(1) {
  animation-delay: 1800ms;
}

.self-building-square-spinner .square:nth-child(2) {
  animation-delay: 2100ms;
}

.self-building-square-spinner .square:nth-child(3) {
  animation-delay: 2400ms;
}

.self-building-square-spinner .square:nth-child(4) {
  animation-delay: 900ms;
}

.self-building-square-spinner .square:nth-child(5) {
  animation-delay: 1200ms;
}

.self-building-square-spinner .square:nth-child(6) {
  animation-delay: 1500ms;
}

.self-building-square-spinner .square:nth-child(7) {
  animation-delay: 0ms;
}

.self-building-square-spinner .square:nth-child(8) {
  animation-delay: 300ms;
}

.self-building-square-spinner .square:nth-child(9) {
  animation-delay: 600ms;
}

.self-building-square-spinner .clear {
  clear: both;
}

.copyable-code-container {
  margin-bottom: 1rem;
}
.copyable-code-container .api-key-display {
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 0.5rem;
}
.copyable-code-container .code-block {
  flex: 1;
  background-color: #1e1e1e;
  /* ダークグレーの背景色 */
  color: #f8f8f8;
  /* 白っぽいテキスト色 */
  border: 1px solid #333;
  border-radius: 4px;
  padding: 0.75rem;
  font-family: "Consolas", "Monaco", "Courier New", monospace;
  /* コード用フォント */
  overflow-x: auto;
  margin: 0;
  word-break: break-all;
  line-height: 1.4;
}
.copyable-code-container .copy-button {
  position: absolute;
  right: 8px;
  top: 8px;
  background-color: white;
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 4px 8px;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 0.8rem;
  display: flex;
  align-items: center;
  gap: 4px;
}
.copyable-code-container .copy-button:hover {
  background-color: #f0f0f0;
}
.copyable-code-container .copy-button.copied {
  background-color: #e6f7e6;
  border-color: #c3e6cb;
  color: #155724;
}

/* APIキー説明セクションのスタイル */
.setting_page_external_api_key .api-key-info-container {
  background-color: #f8f9fa;
  border-radius: 8px;
  padding: 24px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.setting_page_external_api_key .api-key-info-header {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
  border-bottom: 1px solid #e9ecef;
  padding-bottom: 16px;
}
.setting_page_external_api_key .api-key-info-header .info-icon {
  color: #0e70c0;
  font-size: 24px;
  margin-right: 12px;
}
.setting_page_external_api_key .api-key-info-header h2 {
  font-size: 20px;
  font-weight: 600;
  margin: 0;
  color: #333;
}
.setting_page_external_api_key .api-key-info-content {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
}
.setting_page_external_api_key .info-section h3 {
  font-size: 16px;
  color: #333;
  margin-top: 0;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
}
.setting_page_external_api_key .info-section .section-icon {
  color: #0e70c0;
  margin-right: 8px;
  font-size: 16px;
}
.setting_page_external_api_key .info-section p {
  color: #555;
  line-height: 1.6;
  margin: 0;
}
.setting_page_external_api_key .contact-section {
  background-color: #e6f3fa;
  border-radius: 6px;
  padding: 16px;
}
.setting_page_external_api_key .contact-button {
  background-color: #0e70c0;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  margin-top: 12px;
  cursor: pointer;
  transition: background-color 0.2s ease;
  display: flex;
  align-items: center;
  font-weight: 500;
}
.setting_page_external_api_key .contact-button svg {
  margin-right: 8px;
}
.setting_page_external_api_key .contact-button:hover {
  background-color: #0a5a9c;
}
@media (max-width: 768px) {
  .setting_page_external_api_key .api-key-info-content {
    grid-template-columns: 1fr;
  }
}

.setting_external_api_key .api-key-instruction, .setting_external_api_key .api-key-container, .setting_external_api_key .api-guidelines-section {
  margin-bottom: 3rem;
}
.setting_external_api_key .section-title {
  font-size: 1.1rem;
  margin-bottom: 1rem;
  font-weight: 600;
  color: #333;
  display: flex;
  align-items: center;
}
.setting_external_api_key .section-icon {
  margin-right: 0.5rem;
  color: #0e70c0;
}
.setting_external_api_key .api-guidelines {
  background-color: #fff8e6;
  border-radius: 4px;
  padding: 1rem;
  border-left: 4px solid #ffc107;
}
.setting_external_api_key .guideline-item {
  display: flex;
  align-items: flex-start;
  margin-bottom: 1rem;
}
.setting_external_api_key .guideline-item:last-child {
  margin-bottom: 0;
}
.setting_external_api_key .guideline-icon {
  color: #ffc107;
  margin-right: 0.75rem;
  margin-top: 0.25rem;
}
.setting_external_api_key .guideline-text {
  flex: 1;
  line-height: 1.5;
}
.setting_external_api_key .button.delete {
  background-color: #C61616;
  border: 1px solid #C61616;
  color: #FFFFFF;
}
.setting_external_api_key .button.delete:hover {
  background-color: #d75b5b;
  color: #FFFFFF;
}
.setting_external_api_key .button.delete:focus {
  outline: none;
}
.setting_external_api_key .button.delete:disabled {
  cursor: not-allowed;
}

@keyframes self-building-square-spinner {
  0% {
    opacity: 0;
  }
  5% {
    opacity: 1;
    top: 0;
  }
  50.9% {
    opacity: 1;
    top: 0;
  }
  55.9% {
    opacity: 0;
    top: inherit;
  }
}
@media screen and (max-width: 1600px) {
  .task_page .labeling_header .labeling_summary {
    margin-bottom: 24px;
  }
  .task_page .labeling_header .tools {
    width: 100%;
    justify-content: end;
  }
  .task_page .task_status_card_area .task_status_card {
    width: calc((100% - 10px) / 2);
  }
  .task_page .task_status_card_area .task_status_card .contents_area .summary_area {
    justify-content: center;
    gap: 32px;
  }

  .report_page .list_box .block-header .weekly_list {
    display: none;
  }
  .report_page .list_box .block-detail .card_area .card_detail {
    width: calc(25% - 16px);
  }
  .report_page .list_box .block-detail [class$=_card_area] .member_block {
    width: 32.3333333333%;
  }
  .report_page .left_graph_item,
.report_page .mini_graph_item {
    zoom: 0.9;
  }
  .report_page .judgement_area,
.report_page .indicator_head,
.report_page .indicator_item {
    zoom: 0.8;
  }

  .analyze_page .application_card_frame .application_card_wrap {
    width: 32%;
    margin: 0.5%;
  }
}
@media screen and (max-width: 1480px) {
  .risk_page .summary_block {
    flex-flow: column;
    align-items: center;
  }
  .risk_page .summary_block .ranking_block {
    width: 100% !important;
  }
}
@media screen and (max-width: 1280px) {
  .main {
    zoom: 0.85;
    padding: 40px 3% 40px calc(4% + 92px);
    min-height: 100%;
  }

  .fixed_box {
    left: 100px;
    width: calc(100% - 100px);
  }

  .wrapper.open .main {
    padding: 40px 3% 40px calc(4% + 345px);
  }
  .wrapper.open .sticky_header {
    left: 345px;
    width: calc(100% - 345px);
  }
  .wrapper.open .fixed_box {
    left: 353px;
    width: calc(100% - 353px);
    padding: 24px 56px;
  }

  .report_page .list_box .block-header .weekly_list {
    display: none;
  }
  .report_page .list_box .block-detail .card_area .card_detail {
    width: calc(33.3333333333% - 16px);
  }
  .report_page .left_graph_item,
.report_page .mini_graph_item {
    zoom: 0.8;
  }
  .report_page .modal_box.report_modal {
    width: 980px;
  }
  .report_page .monthly .header_area .graph_contents {
    display: block;
    margin: 16px 16px 0px;
  }
  .report_page .monthly .header_area .graph_contents .left_area {
    width: 100%;
  }
  .report_page .monthly .header_area .graph_contents .left_area .comment_area .comment_block {
    min-height: 250px;
  }
  .report_page .monthly .header_area .graph_contents .right_area {
    width: 100%;
    display: flex;
    justify-content: space-between;
  }
  .report_page .monthly .header_area .graph_contents .right_area .block {
    width: 46%;
  }

  .summary_page .comparison {
    flex-flow: column;
  }
  .summary_page .comparison .left_area {
    width: 100%;
  }
  .summary_page .comparison .right_area {
    width: 100%;
  }
  .summary_page .comparison .right_area .header_area {
    margin-left: 0px;
  }
  .summary_page .comparison .right_area .item {
    margin: 4px 0px 4px 0px;
  }
  .summary_page .modal_box.report_modal {
    width: 980px;
  }

  .result_wrapper {
    zoom: 0.8;
  }

  .analyze_page .application_card_frame .application_card_wrap {
    width: 49%;
    margin: 0.5%;
  }
}
@media screen and (max-width: 1180px) {
  .task_page .labeling_header {
    display: block;
  }
  .task_page .task_status_card_area .task_status_card {
    width: 100%;
  }
}
@media screen and (max-width: 980px) {
  .report_page .list_box .block-header .weekly_list {
    display: none;
  }
  .report_page .list_box .block-detail .card_area .card_detail {
    width: calc(50% - 16px);
  }
  .report_page .list_box .block-detail [class$=_card_area] .member_block {
    width: 49%;
  }
}
@media print {
  .header {
    display: none;
  }

  .side {
    display: none;
  }

  .side_sub_wrap {
    display: none;
  }

  .wrapper {
    padding-top: 0;
  }

  .main {
    padding: 40px;
  }

  .wg-default,
.wg-default .country-selector {
    display: none;
  }

  #launcher {
    display: none;
  }
}
.header_area.measurement {
  display: flex;
  justify-content: space-between;
  padding: 8px;
  margin-bottom: 10px;
  gap: 5px;
}
.header_area.measurement .title {
  font-size: large;
}
.header_area.measurement .edit_button_area {
  display: flex;
  gap: 5px;
}
.header_area.measurement .edit_button {
  border: 1px solid #0f9655;
  color: #0f9655;
  background-color: #e7fee8;
  border-radius: 4px;
}
.header_area.measurement .edit_button.checked {
  border: 1px solid #cccccc;
  pointer-events: none;
  background-color: #eeeeee;
  color: #cccccc;
}

.company_track_table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 15px;
}
.company_track_table thead tr {
  border-bottom: 1px solid #D5DADF;
}
.company_track_table thead th {
  text-align: center;
  padding: 5px 10px;
}
.company_track_table thead th:nth-of-type(1) {
  width: 14%;
}
.company_track_table thead th:nth-of-type(2) {
  width: 14%;
}
.company_track_table thead th:nth-of-type(3) {
  width: 14%;
}
.company_track_table thead th:nth-of-type(4) {
  width: 14%;
}
.company_track_table thead th:nth-of-type(5) {
  width: 14%;
}
.company_track_table thead th:nth-of-type(6) {
  width: 14%;
}
.company_track_table thead th:nth-of-type(7) {
  width: 14%;
}
.company_track_table td {
  text-align: center;
  padding: 15px 0px;
  vertical-align: middle;
}

.edit_modal_wrap {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 2050;
  overflow-y: scroll;
  overflow-x: auto;
  display: flex;
}

.gray_area {
  background-color: black;
  opacity: 0.3;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 2002;
}

.edit_modal {
  margin: auto;
  background-color: #FFFFFF;
  border-radius: 8px;
  width: 750px;
  z-index: 2060;
  animation: modal_slide_in 1s;
  animation-fill-mode: forwards;
  position: relative;
}
.edit_modal .edit_modal_header {
  padding: 8px 32px;
  font-size: 28px;
  border-bottom: 1px solid #A9AFB3;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.edit_modal .edit_modal_body {
  padding: 20px;
}
.edit_modal .edit_modal_body .company_title {
  font-size: large;
  margin-bottom: 10px;
}
.edit_modal .edit_modal_body fieldset {
  border: 1px solid #999999;
  border-radius: 4px;
  padding: 8px;
  margin-bottom: 10px;
}
.edit_modal .edit_modal_body fieldset .target_members_list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.edit_modal .edit_modal_body fieldset .target_members_list .track_member {
  flex-shrink: 0;
  border: 1px solid #CCCCCC;
  border-radius: 20px;
  padding: 4px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 3px 3px;
}
.edit_modal .edit_modal_body fieldset .target_members_list .track_member img {
  border-radius: 50%;
  width: 20px;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table {
  width: 100%;
  border-collapse: collapse;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table thead {
  border-bottom: 1px solid #D5DADF;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table tr:nth-child(2n) {
  background-color: #F5F5F5;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table tbody tr {
  height: 58px;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td {
  text-align: center;
  vertical-align: middle;
  padding: 10px 5px;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th:nth-of-type(1),
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td:nth-of-type(1) {
  width: 20%;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th:nth-of-type(2),
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td:nth-of-type(2) {
  width: 25%;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th:nth-of-type(3),
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td:nth-of-type(3) {
  width: 25%;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th:nth-of-type(4),
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td:nth-of-type(4) {
  width: 5%;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th:nth-of-type(5),
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td:nth-of-type(5) {
  width: 25%;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th .start_track_time,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th .end_track_time,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td .start_track_time,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td .end_track_time {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th .start_track_time div,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th .end_track_time div,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td .start_track_time div,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td .end_track_time div {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: auto;
  font-size: 16px;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th .start_track_time select,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th .end_track_time select,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td .start_track_time select,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td .end_track_time select {
  border: solid 1px black;
  border-radius: 4px;
  padding: 0.4em 0.8em;
  appearance: auto;
  cursor: pointer;
  background-color: #FFFFFF;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th .start_track_time.checked,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th .end_track_time.checked,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td .start_track_time.checked,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td .end_track_time.checked {
  opacity: 0.3;
  pointer-events: none;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th .check_box,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td .check_box {
  color: #666666;
  cursor: pointer;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th .check_box.checked,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td .check_box.checked {
  color: #228b22;
}
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table th .check_box.no_checked,
.edit_modal .edit_modal_body fieldset.setting_weekly_track .setting_weekly_track_time_table td .check_box.no_checked {
  pointer-events: none;
  opacity: 0.3;
  cursor: none;
}
.edit_modal .edit_modal_footer {
  padding: 12px 8px;
  border-top: 1px solid #A9AFB3;
  display: flex;
  justify-content: space-around;
  text-align: center;
}
.edit_modal .edit_modal_footer .button {
  width: 40%;
  color: white;
  background-color: #4472BA;
  border-radius: 4px;
}
.edit_modal .edit_modal_footer .button:hover {
  background-color: #094E8D;
  text-decoration: none;
}
.edit_modal .edit_modal_footer .button.delete {
  border: 1px solid #C61616;
  color: white;
  background-color: #C61616;
}
.edit_modal .edit_modal_footer .button.delete:hover {
  background-color: #d75b5b;
}
.edit_modal .edit_modal_footer .button.cancel {
  border: 1px solid #656E73;
  color: #656E73;
  background-color: white;
}
.edit_modal .edit_modal_footer .button.cancel:hover {
  color: white;
  background-color: gray;
}

.weekly_track_table {
  width: 100%;
  border-collapse: collapse;
}
.weekly_track_table .check_box {
  font-size: 1.5em;
  color: #666666;
  cursor: pointer;
}
.weekly_track_table .check_box.checked {
  color: #228b22;
}
.weekly_track_table thead {
  border-bottom: 1px solid #D5DADF;
}
.weekly_track_table thead .total_table_header th {
  text-align: center;
  vertical-align: middle;
  padding: 10px 5px;
}
.weekly_track_table thead .total_table_header th:nth-of-type(1) {
  width: 5%;
}
.weekly_track_table thead .total_table_header th:nth-of-type(2) {
  width: 9%;
}
.weekly_track_table thead .total_table_header th:nth-of-type(3) {
  width: 5%;
}
.weekly_track_table thead .total_table_header th:nth-of-type(4) {
  width: 22%;
}
.weekly_track_table thead .total_table_header th .sort_block {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.weekly_track_table thead .week_header th {
  text-align: center;
  vertical-align: middle;
  padding: 5px 5px;
}
.weekly_track_table thead .week_header th:nth-of-type(1) {
  width: 8%;
}
.weekly_track_table thead .week_header th:nth-of-type(2) {
  width: 8%;
}
.weekly_track_table thead .week_header th:nth-of-type(3) {
  width: 8%;
}
.weekly_track_table thead .week_header th:nth-of-type(4) {
  width: 8%;
}
.weekly_track_table thead .week_header th:nth-of-type(5) {
  width: 8%;
}
.weekly_track_table thead .week_header th:nth-of-type(6) {
  width: 8%;
}
.weekly_track_table thead .week_header th:nth-of-type(7) {
  width: 8%;
}
.weekly_track_table tbody tr {
  min-height: 50px;
}
.weekly_track_table tbody tr:nth-child(2n) {
  background-color: #F5F5F5;
}
.weekly_track_table tbody tr td {
  text-align: center;
  padding: 2px 4px;
  vertical-align: middle;
}
.weekly_track_table tbody tr td .track_setting {
  display: flex;
  align-items: center;
  justify-content: center;
}
.weekly_track_table tbody tr td .track_setting button {
  font-size: 20px;
}
.weekly_track_table tbody tr td .track_setting button.edit {
  color: #666666;
}
.weekly_track_table tbody tr td .track_setting button.delete {
  color: #E44242;
}
.weekly_track_table tbody tr td .track_table_profile {
  display: flex;
  align-items: center;
  padding-left: 10px;
  gap: 5px;
  min-height: 50px;
}
.weekly_track_table tbody tr td .track_table_profile .profile_icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
.weekly_track_table tbody tr td .authority_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.weekly_track_table tbody tr td .authority_area .switch_outer {
  background-color: lightgray;
  border-radius: 15px;
  height: 20px;
  width: 40px;
  position: relative;
  cursor: pointer;
  transition: background-color 0.2s ease-in-out;
}
.weekly_track_table tbody tr td .authority_area .switch_outer.active {
  background-color: #0f9655;
}
.weekly_track_table tbody tr td .authority_area .switch_outer .toggle_slider {
  background-color: white;
  height: 15px;
  width: 15px;
  border-radius: 50%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 3px;
  margin: auto;
  transition: left 0.3s ease-in-out;
}
.weekly_track_table tbody tr td .authority_area .switch_outer .toggle_slider.active {
  left: 22px;
}

table.extra_order_table {
  width: 100%;
  border: solid 1px #333333;
}
table.extra_order_table th,
table.extra_order_table td {
  width: 10%;
  border: solid 1px #333333;
  text-align: center;
  vertical-align: middle;
  padding: 8px;
}
table.extra_order_table th:nth-child(1),
table.extra_order_table td:nth-child(1) {
  width: 50%;
}
table.extra_order_table th:nth-child(5),
table.extra_order_table td:nth-child(5) {
  width: 20%;
}
table.extra_order_table th::before,
table.extra_order_table td::before {
  content: "";
  display: block;
  min-height: 14px;
  float: left;
}
table.extra_order_table th {
  background-color: #EEEEEE;
}

table.extra_order_total_table {
  width: 100%;
  border: solid 1px #333333;
}
table.extra_order_total_table th,
table.extra_order_total_table td {
  width: 33.3333333333%;
  border: solid 1px #333333;
  text-align: center;
  vertical-align: middle;
  padding: 8px;
}
table.extra_order_total_table th::before,
table.extra_order_total_table td::before {
  content: "";
  display: block;
  min-height: 14px;
  float: left;
}
table.extra_order_total_table th {
  background-color: #EEEEEE;
}

button.change_contract {
  background-color: #5d00b3;
  border: 1px solid #5d00b3;
  color: #FFFFFF;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 200px;
  font-size: 12px;
  cursor: pointer;
}
button.change_contract:hover {
  opacity: 0.8;
}

/*# sourceMappingURL=index-349407adc163f05dcf9c.css.map*/