@charset "UTF-8";
/*공통으로 쓰일 스타일*/
.cl {
  clear: both;
}

.tal {
  text-align: left !important;
}

.tar {
  text-align: right !important;
}

.tac {
  text-align: center !important;
}

.tae {
  text-align: end !important;
}

.hauto {
  height: auto !important;
}

.wauto {
  width: auto !important;
}

.as_start {
  align-self: start;
}

.as_center {
  align-self: center;
}

.ai_center {
  align-items: center;
}

.ai_end {
  align-items: flex-end;
}

.valign_top {
  vertical-align: top;
}

.flex1 {
  flex: 1;
}

.fs_bold {
  font-weight: 700 !important;
}

.fs_medium {
  font-weight: 500;
}

.one_full {
  width: 100% !important;
}

.op00 {
  opacity: 0 !important;
}

.op02 {
  opacity: 0.2 !important;
}

.op04 {
  opacity: 0.4 !important;
}

.op06 {
  opacity: 0.6 !important;
}

.op10 {
  opacity: 1 !important;
}

.dpblock {
  display: block !important;
}

.dpnone {
  display: none !important;
}

.posrel {
  position: relative !important;
}

.posab {
  position: absolute !important;
}

.ab_trans_center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.lh_28 {
  line-height: 1.75rem !important;
}

.lh_21 {
  line-height: 1.3125rem !important;
}

.lh_18 {
  line-height: 1.125rem !important;
}

.lh_16 {
  line-height: 1rem !important;
}

.ls_3 {
  letter-spacing: 0.1875rem;
}

.blind {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  margin: -0.063rem;
  width: 0.063rem;
  height: 0.063rem;
}

.bd_left1 {
  border: none !important;
  border-left: 0.1rem solid rgba(255, 255, 255, 0.2) !important;
}

.bd_right1 {
  border: none !important;
  border-right: 0.1rem solid rgba(255, 255, 255, 0.2) !important;
}

.bd_sky {
  border: 0.063rem solid #27D4FF !important;
}

/* placeholder */
input::-moz-placeholder, textarea::-moz-placeholder {
  color: var(--white-w_40);
}
input::placeholder,
textarea::placeholder {
  color: var(--white-w_40);
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: var(--white-w_40);
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: var(--white-w_40);
}

input:-moz-input-placeholder,
textarea:-moz-input-placeholder {
  color: var(--white-w_40);
}

input[type=password] {
  letter-spacing: 0.063rem;
}

/*scroll*/
.scroll, .textarea {
  overflow: overlay;
}
.scroll.sc_y, .textarea.sc_y {
  overflow: hidden;
  overflow-y: auto;
  padding: 0 0.5rem 0 0;
}
.scroll.sc_y.main, .textarea.sc_y.main {
  max-height: 23.438rem;
}
.scroll.sc_y.user, .textarea.sc_y.user {
  max-height: calc(100% - 2.125rem);
}

.scroll::-webkit-scrollbar {
  width: 0.25rem;
  height: 0.25rem;
}

.textarea::-webkit-scrollbar {
  width: 0.125rem;
  height: 0.125rem;
}

.scroll::-webkit-scrollbar-thumb,
.textarea::-webkit-scrollbar-thumb {
  background-color: #ddd;
  background-color: rgba(255, 255, 255, 0.38);
  background-color: var(--white-w_40);
  border-radius: 0;
}

.scroll::-webkit-scrollbar-track,
.textarea::-webkit-scrollbar-track {
  background-color: none;
}

.scroll::-webkit-scrollbar-corner,
.textarea::-webkit-scrollbar-corner {
  background-color: transparent;
}

.overflow_y {
  overflow-y: auto;
}
.overflow_y::-webkit-scrollbar {
  width: 0.25rem;
}
.overflow_y::-webkit-scrollbar-thumb {
  background: var(--white-w_40);
  border-radius: 0.625rem;
}
.overflow_y::-webkit-scrollbar-track {
  background-color: none;
}
.overflow_y::-webkit-scrollbar-corner {
  background-color: transparent;
}

.anchor_default {
  text-decoration: underline;
  color: #024294 !important;
}
.anchor_default:hover, .anchor_default:focus {
  text-decoration: underline;
}

.fc_primary {
  color: #27D4FF !important;
}

.fc_normal {
  color: #338FFF !important;
}

.fc_normal_more40 {
  color: rgba(51, 143, 255, 0.4) !important;
}

.fc_purple {
  color: #FF00FF !important;
}

.fc_yellow {
  color: #FFE043 !important;
}

.fc_yellow_04 {
  color: #FFBC04 !important;
}

.fc_yellow_code {
  color: rgba(255, 255, 128, 0.6823529412) !important;
}

.fc_green {
  color: #16D9AB !important;
}

.fc_code_green {
  color: #1CAF93 !important;
}

.fc_light_green {
  color: #00FF00 !important;
}

.fc_card_green {
  color: #1CBD6D;
}

.fc_code_class {
  color: deeppink !important;
}

.fc_blue {
  color: #024294 !important;
}

.text_error {
  color: #FF1F55 !important;
}

.fc_black99 {
  color: rgba(0, 0, 0, 0.6) !important;
}

.fc_black60 {
  color: rgba(0, 0, 0, 0.6) !important;
}

.fc_black87 {
  color: rgba(0, 0, 0, 0.87) !important;
}

.fc_black40 {
  color: rgba(0, 0, 0, 0.4) !important;
}

.fc_blackcc {
  color: rgba(0, 0, 0, 0.8) !important;
}

.bg_blackde {
  color: rgba(0, 0, 0, 0.871) !important;
}

.fc_error {
  color: #D60000 !important;
}

.fc_999 {
  color: #999999 !important;
}

.fc_222 {
  color: #222222 !important;
}

.fc_grey99 {
  color: rgba(255, 255, 255, 0.6) !important;
}

.fc_grey87 {
  color: rgba(255, 255, 255, 0.87) !important;
}

.fc_grey60 {
  color: rgba(255, 255, 255, 0.6) !important;
}

.fc_grey50 {
  color: rgba(255, 255, 255, 0.5) !important;
}

.fc_grey40 {
  color: rgba(255, 255, 255, 0.4) !important;
}

.fc_grey38 {
  color: rgba(255, 255, 255, 0.38) !important;
}

.fc_grey30 {
  color: rgba(255, 255, 255, 0.3) !important;
}

.fc_grey20 {
  color: rgba(255, 255, 255, 0.2) !important;
}

.fc_grey10 {
  color: rgba(255, 255, 255, 0.1) !important;
}

.fc_grey06 {
  color: rgba(255, 255, 255, 0.06) !important;
}

.fc_white {
  color: #ffffff !important;
}

.fs_24_bold {
  font-size: 1.5rem;
  font-weight: 700;
}

.fs_24_medium {
  font-size: 1.5rem;
  font-weight: 500;
}

.fs_20_medium {
  font-size: 1.25rem;
  font-weight: 500;
}

.fs_18_bold {
  font-size: 1.125rem;
  font-weight: 700;
}

.fs_18_medium {
  font-size: 1.125rem;
  font-weight: 500;
}

.fs_16_bold {
  font-size: 1rem;
  font-weight: 700;
}

.fs_16_medium {
  font-size: 1rem;
  font-weight: 500;
}

.fs_16 {
  font-size: 1rem;
  font-weight: 400;
}

.fs_14_bold {
  font-size: 0.875rem;
  font-weight: 700;
}

.fs_14_medium {
  font-size: 0.875rem;
  font-weight: 500;
}

.fs_14 {
  font-size: 0.875rem;
  font-weight: 400;
}

.fs_14_light {
  font-size: 0.875rem;
  font-weight: 300;
}

.fs_13_medium {
  font-size: 0.8125rem;
  font-weight: 500;
}

.fs_13 {
  font-size: 0.8125rem;
  font-weight: 400;
}

.fs_12_medium {
  font-size: 0.75rem !important;
  font-weight: 500 !important;
}

.fs_12 {
  font-size: 0.75rem;
  font-weight: 400;
}

.fs_11_medium {
  font-size: 0.6875rem;
  font-weight: 500;
}

.fs_11 {
  font-size: 0.6875rem;
  font-weight: 400;
}

.fs_10 {
  font-size: 0.625rem;
  font-weight: 400;
}

.border_radius50 {
  border-radius: 50%;
}

.border_radius0 {
  border-radius: 0 !important;
}

.border_none {
  border: none !important;
}

.border_greyE0 {
  border: 0.063rem solid #DCDDE0;
}

.border_greyEb {
  border: 0.063rem solid #e6e7eb;
}

.border_greyF5 {
  border: 0.063rem solid #F0F1F5;
}

.border_white20 {
  border: 0.063rem solid rgba(255, 255, 255, 0.2);
}

.border_white38 {
  border: 0.063rem solid rgba(255, 255, 255, 0.38);
}

.border_black30 {
  border: 0.063rem solid rgba(0, 0, 0, 0.3);
}

.border_sky40 {
  border: 0.063rem solid rgba(39, 212, 255, 0.4) !important;
}

.top_white12 {
  border-top: 0.063rem solid rgba(255, 255, 255, 0.1);
}

.rht_white12 {
  border-right: 0.063rem solid rgba(255, 255, 255, 0.1) !important;
}

.btm_white20 {
  color: var(--white-w_60);
  border-bottom: 0.063rem solid var(--white-w_20);
}
.btm_white20 .id, .btm_white20 .name {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--white-w_87);
}

.btm_white12 {
  border-bottom: 0.063rem solid rgba(255, 255, 255, 0.1);
}

.btm_none {
  border-bottom: none !important;
}

.route_border_sky40 {
  border: 0.313rem solid var(--primary-pri_40);
}

.route_border_sky {
  border: 0.313rem solid var(--primary-pri_100);
}

.route_border_yellow {
  border: 0.313rem solid #FFE043;
}

.route_border_blue {
  border: 0.313rem solid rgba(0, 104, 230, 0.6);
}

.route_border_purple {
  border: 0.313rem solid #8972FF;
}

.route_border_red {
  border: 0.313rem solid #D60000;
}

.bg_ui_gradation {
  background: transparent linear-gradient(104deg, #0068E6 0%, #27D4FF 100%) 0% 0% no-repeat;
}

.bg_black {
  background-color: rgb(0, 0, 0);
}

.bg_default {
  background: rgb(10, 11, 20) !important;
}

.bg_ui_blue {
  background: #024294 !important;
}

.bg_ui_blue_more {
  background: #0068E6 !important;
}

.bg_cluster {
  background: rgb(0, 104, 230) !important;
}

.bg_white {
  background: #ffffff !important;
}

.bg_ui_sky {
  background: #27D4FF !important;
}

.bg_ui_sky_blue {
  background: var(--primary-pri_100) !important;
}

.bg_ui_sky_10 {
  background-color: rgba(39, 212, 255, 0.1);
}

.bg_ui_sky_05 {
  background-color: rgba(39, 212, 255, 0.05);
}

.bg_secondary__purple {
  background: #937EFF;
}

.bg_secondary__green {
  background: #16D9AB;
}

.bg_secondary__yellow {
  background: #FFE043;
}

.bg_state__normal {
  background: #024294;
}

.bg_state__success {
  background: #00BD78;
}

.bg_state__error {
  background: #D60000;
}

.bg_grey50 {
  background: rgba(255, 255, 255, 0.5);
}

.bg_grey40 {
  background: rgba(255, 255, 255, 0.4);
}

.bg_grey30 {
  background: rgba(255, 255, 255, 0.3);
}

.bg_grey20 {
  background: rgba(255, 255, 255, 0.2);
}

.bg_grey16 {
  background: rgba(255, 255, 255, 0.16);
}

.bg_grey10 {
  background: rgba(255, 255, 255, 0.1);
}

.bg_grey06 {
  background: rgba(255, 255, 255, 0.06);
}

.bg_black40 {
  background: rgba(0, 0, 0, 0.4);
}

.bg_purple {
  background: rgba(255, 0, 255, 0.4);
}

.bg_greyf5 {
  background: #F0F1F5;
}

.bg_greye0 {
  background: #DCDDE0;
}

.grade_color01 {
  background: #850404;
}

.grade_color02 {
  background: #B31212;
}

.grade_color03 {
  background: #E62222;
}

.grade_color04 {
  background: #FC5C34;
}

.grade_color05 {
  background: #FF8000;
}

.grade_color06 {
  background: #F0A800;
}

.grade_color07 {
  background: #51B448;
}

.grade_color08 {
  background: #009961;
}

.grade_color09 {
  background: #0085D8;
}

.grade_color10 {
  background: #0068E6;
}

.grade_color11 {
  background: var(--white-w_40);
}

.gradeko_color02 {
  background: #008FB2;
}

.grade_color12 {
  background: #D60000;
}

.grade_color13 {
  background: #008C69;
}

.rainbow_color01 {
  background: #9DFFBE;
}

.rainbow_color02 {
  background: #55FAA7;
}

.rainbow_color03 {
  background: #16D9AB;
}

.rainbow_color04 {
  background: #00CBCB;
}

.rainbow_color05 {
  background: #27D4FF;
}

.rainbow_color06 {
  background: #16A3E9;
}

.rainbow_color07 {
  background: #0077FF;
}

.rainbow_color08 {
  background: #0E44E5;
}

.rainbow_color09 {
  background: #0A2ACC;
}

.rainbow_color10 {
  background: #4D4DFF;
}

.rainbow_color11 {
  background: #6734FF;
}

.rainbow_color12 {
  background: #8972FF;
}

.rainbow_color13 {
  background: #B5A6FF;
}

.rainbow_color14 {
  background: #D4CCFF;
}

.label_color01 {
  background: #51B448;
}

.label_color02 {
  background: #009961;
}

.label_color03 {
  background: #00A396;
}

.label_color04 {
  background: #0EA3FF;
}

.label_color05 {
  background: #1683FF;
}

.label_color06 {
  background: #0068E6;
}

.label_color07 {
  background: #114FE8;
}

.label_color08 {
  background: #1638E0;
}

.label_color09 {
  background: #4239EA;
}

.label_color10 {
  background: #6440F5;
}

.label_color11 {
  background: #7856FE;
}

.label_color12 {
  background: #9175FF;
}

.label_color13 {
  background: #7230DF;
}

.label_color14 {
  background: #8D12B2;
}

.label_color15 {
  background: #B81265;
}

.label_color16 {
  background: rgba(255, 255, 255, 0.12);
}

.label_color17 {
  background: #07F;
}

.dust_color01 {
  background: #139DF2;
}

.dust_color02 {
  background: #1CBD6D;
}

.dust_color02_1 {
  background: #82D971;
}

.dust_color03 {
  background: #F0A800;
}

.dust_color03_1 {
  background: #FC8A18;
}

.dust_color03_2 {
  background: #FC5C34;
}

.dust_color04 {
  background: #E62222;
}

/* flex */
.dflx {
  display: flex;
}

.dflx_as {
  display: flex;
  align-items: flex-start;
}

.dflx_ac {
  display: flex;
  align-items: center;
}

.dflx_ae {
  display: flex;
  align-items: flex-end;
}

.dflx_jbet {
  display: flex;
  justify-content: space-between;
}

.dflx_jard {
  display: flex;
  justify-content: space-around;
}

.dflx_jstart {
  display: flex;
  justify-content: flex-start;
}

.dflx_dcol_jbet {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.dflx_jcent {
  display: flex;
  justify-content: center;
}

.dflx_jend {
  display: flex;
  justify-content: flex-end;
}

.dflx_ac_jcent {
  display: flex;
  align-items: center;
  justify-content: center;
}

.dflx_as_jbet {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.dflx_ac_jbet {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.dflx_ae_jbet {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

.dflx_ac_jend {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

/* grid */
.flow_hidden {
  overflow: hidden !important;
}

.display_none {
  display: none !important;
}

.display_block {
  display: block !important;
}

.display_grid {
  display: grid;
}

.dflx_ac_jc_full {
  align-items: center;
  justify-content: center;
  display: flex;
  flex: auto;
  height: 100%;
}

.display_flex {
  display: flex;
}

.dflx_column {
  display: flex;
  flex-direction: column !important;
}

.flex_column {
  flex-direction: column !important;
}

.grid_column1 {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
}

.grid_column2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

.grid_column3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.grid_column4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.grid_column5 {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
}

.grid_column6 {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
}

.gird_column8 {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
}

.gird_column10 {
  display: grid;
  grid-template-columns: repeat(10, 1fr);
}

.gird_column11 {
  display: grid;
  grid-template-columns: repeat(11, 1fr);
}

.gird_column13 {
  display: grid;
  grid-template-columns: repeat(13, 1fr);
}

.gird_column14 {
  display: grid;
  grid-template-columns: repeat(14, 1fr);
}

.layout_acjc {
  align-items: center;
  justify-content: center;
}

.layout_acjb {
  align-items: center;
  justify-content: space-between;
}

.layout_ac {
  align-items: center;
}

.layout_as {
  align-items: flex-start;
}

.align_end {
  align-self: flex-end;
}

.column_1 {
  width: 100% !important;
}

.column_2 {
  width: 50% !important;
}

.column_3 {
  width: 33.3333333333%;
}

.column_4 {
  width: 25%;
}

.column_5 {
  width: 20%;
}

.column_6 {
  width: 16.6666666667%;
}

.column_7 {
  width: 14.2857142857%;
}

.column_8 {
  width: 12.5%;
}

.column_9 {
  width: 11.1111111111%;
}

.column_10 {
  width: 10%;
}

.column_11 {
  width: 9.0909090909%;
}

.column_12 {
  width: 8.3333333333%;
}

.gap_0 {
  gap: 0 !important;
}

.gap_1 {
  gap: 0.0625rem;
}

.gap_2 {
  gap: 0.125rem;
}

.gap_3 {
  gap: 0.1875rem;
}

.gap_4 {
  gap: 0.25rem;
}

.gap_5 {
  gap: 0.3125rem;
}

.gap_6 {
  gap: 0.375rem;
}

.gap_7 {
  gap: 0.4375rem;
}

.gap_8 {
  gap: 0.5rem;
}

.gap_9 {
  gap: 0.5625rem;
}

.gap_10 {
  gap: 0.625rem;
}

.gap_11 {
  gap: 0.6875rem;
}

.gap_12 {
  gap: 0.75em;
}

.gap_13 {
  gap: 0.8125rem;
}

.gap_14 {
  gap: 0.875rem;
}

.gap_15 {
  gap: 0.9375rem;
}

.gap_16 {
  gap: 1rem;
}

.gap_17 {
  gap: 1.0625rem;
}

.gap_18 {
  gap: 1.125rem;
}

.gap_19 {
  gap: 1.1875rem;
}

.gap_20 {
  gap: 1.25rem;
}

.gap_24 {
  gap: 1.5rem;
}

.gap_30 {
  gap: 1.875rem;
}

.gap_32 {
  gap: 2rem;
}

.gap_40 {
  gap: 2.5rem;
}

.gap_50 {
  gap: 3.125rem;
}

.gap_60 {
  gap: 3.75rem;
}

.gap_row8 {
  row-gap: 0.5rem;
}

.gap_row10 {
  row-gap: 0.625rem;
}

.gap_row16 {
  row-gap: 1rem;
}

.auto_row24 {
  display: grid;
  grid-auto-rows: 1.5rem;
}

.auto_row32 {
  display: grid;
  grid-auto-rows: 2rem;
}

.gap_colm8 {
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
}

.col_gap0 {
  -moz-column-gap: 0 !important;
       column-gap: 0 !important;
}

.col_gap2 {
  -moz-column-gap: 0.125rem;
       column-gap: 0.125rem;
}

.col_gap4 {
  -moz-column-gap: 0.25rem;
       column-gap: 0.25rem;
}

.col_gap6 {
  -moz-column-gap: 0.375rem;
       column-gap: 0.375rem;
}

.col_gap7 {
  -moz-column-gap: 0.438rem;
       column-gap: 0.438rem;
}

.col_gap8 {
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
}

.col_gap10 {
  -moz-column-gap: 0.625rem;
       column-gap: 0.625rem;
}

.col_gap12 {
  -moz-column-gap: 0.75rem;
       column-gap: 0.75rem;
}

.col_gap16 {
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}

.col_gap18 {
  -moz-column-gap: 1.125rem;
       column-gap: 1.125rem;
}

.col_gap20 {
  -moz-column-gap: 1.25rem;
       column-gap: 1.25rem;
}

.col_gap24 {
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
}

.col_gap28 {
  -moz-column-gap: 1.75rem;
       column-gap: 1.75rem;
}

.col_gap30 {
  -moz-column-gap: 1.875rem;
       column-gap: 1.875rem;
}

.col_gap32 {
  -moz-column-gap: 2rem;
       column-gap: 2rem;
}

.col_gap40 {
  -moz-column-gap: 2.5rem;
       column-gap: 2.5rem;
}

.col_gap48 {
  -moz-column-gap: 3rem;
       column-gap: 3rem;
}

.col_gap50 {
  -moz-column-gap: 3.125rem;
       column-gap: 3.125rem;
}

.col_gap60 {
  -moz-column-gap: 3.75rem;
       column-gap: 3.75rem;
}

.col_gap64 {
  -moz-column-gap: 4rem;
       column-gap: 4rem;
}

.col_gap80 {
  -moz-column-gap: 5rem;
       column-gap: 5rem;
}

.col_gap100 {
  -moz-column-gap: 6.25rem;
       column-gap: 6.25rem;
}

.col_gap164 {
  -moz-column-gap: 10.25rem;
       column-gap: 10.25rem;
}

.col_gap200 {
  -moz-column-gap: 12.5rem;
       column-gap: 12.5rem;
}

.col_gap250 {
  -moz-column-gap: 15.625rem;
       column-gap: 15.625rem;
}

.col_gap272 {
  -moz-column-gap: 17rem;
       column-gap: 17rem;
}

.col_gap300 {
  -moz-column-gap: 18.75rem;
       column-gap: 18.75rem;
}

.col_gap464 {
  -moz-column-gap: 29rem;
       column-gap: 29rem;
}

.col_gap500 {
  -moz-column-gap: 31.25rem;
       column-gap: 31.25rem;
}

.col_gap732 {
  -moz-column-gap: 45.75rem;
       column-gap: 45.75rem;
}

.col_gap796 {
  -moz-column-gap: 49.75rem;
       column-gap: 49.75rem;
}

.row_gap1 {
  row-gap: 0.063rem;
}

.row_gap2 {
  row-gap: 0.125rem;
}

.row_gap4 {
  row-gap: 0.25rem;
}

.row_gap6 {
  row-gap: 0.375rem;
}

.row_gap8 {
  row-gap: 0.5rem;
}

.row_gap10 {
  row-gap: 0.625rem;
}

.row_gap12 {
  row-gap: 0.75rem;
}

.row_gap15 {
  row-gap: 0.938rem;
}

.row_gap16 {
  row-gap: 1rem;
}

.row_gap18 {
  row-gap: 1.125rem;
}

.row_gap20 {
  row-gap: 1.25rem;
}

.row_gap24 {
  row-gap: 1.5rem;
}

.row_gap28 {
  row-gap: 1.75rem;
}

.row_gap30 {
  row-gap: 1.875rem;
}

.row_gap32 {
  row-gap: 2rem;
}

.row_gap40 {
  row-gap: 2.5rem;
}

.row_gap48 {
  row-gap: 3rem;
}

.row_gap50 {
  row-gap: 3.125rem;
}

.row_gap60 {
  row-gap: 3.75rem;
}

.row_gap64 {
  row-gap: 4rem;
}

.row_gap80 {
  row-gap: 5rem;
}

.row_gap100 {
  row-gap: 6.25rem;
}

/* button */
.radius_10 {
  border-radius: 0.625rem;
}

.radius_2 {
  border-radius: 0.125rem;
}

.row_box {
  width: 66.875rem;
  max-width: 66.875rem;
  margin: 0 auto;
}

button .img {
  display: block;
}
button .img_on {
  display: none;
}
button:hover:not(.hover):not(.legend):not(.selected):not(.disabled):not(.map) .img, button:active:not(.map):not(.disabled) .img, button.selected .img {
  display: none;
}
button:hover:not(.hover):not(.legend):not(.selected):not(.disabled):not(.map) .img_on, button:active:not(.map):not(.disabled) .img_on, button.selected .img_on {
  display: block;
}
button:hover:not(.hover):not(.legend):not(.selected):not(.disabled):not(.map) .circle_grey28, button:hover:not(.hover):not(.legend):not(.selected):not(.disabled):not(.map) .circle_grey32, button:active:not(.map):not(.disabled) .circle_grey28, button:active:not(.map):not(.disabled) .circle_grey32, button.selected .circle_grey28, button.selected .circle_grey32 {
  background-color: var(--icon-pri_20-to-100);
}
button:hover:not(.hover):not(.legend):not(.selected):not(.disabled):not(.map) .circle_grey28 .map, button:active:not(.map):not(.disabled) .circle_grey28 .map, button.selected .circle_grey28 .map {
  background-color: unset;
}
button.disabled .img {
  display: block;
}
button.disabled .img_on {
  display: none;
}
button.circle32:hover:not(.disabled), button.circle32:focus:not(.disabled), button.circle32.selected {
  background-color: var(--white-w_12);
  border: none;
}
button.circle32.disabled {
  opacity: 0.6;
}
button.circle_grey32.line:hover, button.circle_grey32.line:focus, button.circle_grey32.line.selected {
  background-color: rgba(39, 212, 255, 0.3);
  border: none;
}

.button_165 {
  align-items: center;
  justify-content: center;
  border-radius: 0.25rem;
  display: flex;
  width: 10.3125rem;
  height: 3rem;
  background-color: #024294;
}

.btn_primary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  background: var(--PRI);
  color: var(--white-w_100);
  border-radius: 8px;
}
.btn_primary.disabled {
  background: var(--white-w_12);
  box-shadow: inset 0 0 0.75rem rgba(255, 255, 255, 0.1);
  color: var(--white-w_20);
}

.btn_secondary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  background: transparent;
  color: var(--PRI);
  border: 1px solid var(--PRI);
  border-radius: 8px;
}
.btn_secondary:hover, .btn_secondary.hover {
  background: var(--white-w_16);
}
.btn_secondary.disabled {
  background: var(--white-w_12);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: var(--white-w_20);
}

.btn_line {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  background: transparent;
  color: var(--white-w_87-sec);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 8px;
}
.btn_line:hover, .btn_line.hover {
  background: var(--white-w_16);
}
.btn_line.disabled {
  background: var(--white-w_12);
  color: var(--white-w_20);
}

.btn_floating {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  box-shadow: 0.25rem 0.25rem 1rem 0 rgba(4, 9, 26, 0.16);
  background: var(--bg_01_80);
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
  color: var(--white-w_100-sec);
}
.btn_floating:hover:not(.selected):not(.card_selected):not(.hover):not(.disabled), .btn_floating.hover {
  background: var(--btn-btn_hover);
  border: none;
  box-shadow: inset 0 0 0.75rem rgba(39, 212, 255, 0.5);
  color: var(--white-w_100);
}
.btn_floating.selected {
  background: var(--btn-btn_default);
  border: none;
  box-shadow: inset 0 0 0.75rem #0476FF;
  color: var(--white-w_100);
}
.btn_floating.card_selected {
  background: var(--tab-btn_default);
  border: none;
  box-shadow: inset 0 0 0.75rem #0476FF;
  color: var(--white-w_100);
}
.btn_floating.disabled {
  background: var(--bg_01_80);
  border: 0.063rem solid var(--line-wh_12-to-100);
  box-shadow: none;
  color: var(--white-w_20);
}

.btn_ffb {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  box-shadow: 0.25rem 0.25rem 1rem 0 rgba(4, 9, 26, 0.16);
  font-size: 0.875rem;
  font-weight: 500;
  background: var(--bg_01_80);
  border: 0.063rem solid var(--line-wh_12-to-40);
  color: var(--white-w_87);
}
.btn_ffb:hover:not(.selected):not(.disabled), .btn_ffb.hover {
  background: var(--primary-pri_12);
  color: var(--primary-pri_100);
  border: 0.063rem solid var(--line-wh_12-to-40);
  font-weight: 700;
}
.btn_ffb.selected {
  background: var(--primary-pri_20);
  border: 0.063rem solid var(--line-wh_12-to-40);
  color: var(--primary-pri_100);
  font-weight: 700;
}
.btn_ffb.disabled {
  background: var(--bg_01_40);
  border: 0.063rem solid var(--white-w_12);
  color: var(--white-w_20);
}

.btn_ghost {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
}
.btn_ghost:hover {
  background: rgba(255, 255, 255, 0.06);
}
.btn_ghost.selected {
  background: transparent;
  color: #27D4FF;
}
.btn_ghost.disabled {
  background: transparent;
  color: rgba(255, 255, 255, 0.38);
}

.btn_line1 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  color: var(--white-w_60);
  background: transparent;
  border: 0.063rem solid var(--white-w_20);
}
.btn_line1:hover, .btn_line1:focus, .btn_line1.selected {
  color: var(--white-w_87-sec);
  border: 0.063rem solid var(--white-w_87-sec);
}
.btn_line1.disabled {
  background: transparent;
  border: 0.063rem solid var(--white-w_20);
  color: rgba(255, 255, 255, 0.38);
}
.btn_line1.withtab {
  border: 0.063rem solid var(--white-w_20);
}
.btn_line1.withtab:hover, .btn_line1.withtab:focus, .btn_line1.withtab.selected {
  color: var(--white-w_87-sec);
  border: 0.063rem solid var(--white-w_87-sec);
}

.btn_line2 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  color: var(--white-w_60);
  background: transparent;
  border: 0.063rem solid var(--white-w_40);
}
.btn_line2:hover, .btn_line2:focus, .btn_line2.selected {
  color: var(--primary-pri_100);
  border: 0.063rem solid var(--primary-pri_100);
}
.btn_line2.disabled {
  border: 0.063rem solid rgba(255, 255, 255, 0.38);
  color: rgba(255, 255, 255, 0.2);
}

.btn_file {
  cursor: pointer;
}

.btn_toggle_primary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  font-size: 0.875rem;
  font-weight: 500;
  background: var(--white-w_12);
  color: var(--white-w_87);
}
.btn_toggle_primary:hover, .btn_toggle_primary:focus, .btn_toggle_primary.selected {
  background: var(--btn-btn_selected);
  color: var(--white-w_100);
}
.btn_toggle_primary.disabled {
  background: rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.38);
}

.btn_toggle_secondary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  background: rgba(255, 255, 255, 0.12);
}
.btn_toggle_secondary.selected {
  background: #04091A 0% 0%;
  border: 0.063rem solid rgba(255, 255, 255, 0.502);
}
.btn_toggle_secondary:hover:not(.selected):not(.disabled), .btn_toggle_secondary:focus:not(.selected):not(.disabled) {
  background: rgba(255, 255, 255, 0.16);
  border: none;
}
.btn_toggle_secondary:hover:not(.selected):not(.disabled) .circle32, .btn_toggle_secondary:focus:not(.selected):not(.disabled) .circle32 {
  background-color: rgba(255, 255, 255, 0.2);
}
.btn_toggle_secondary.disabled {
  background: rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.38);
}

.btn_toggle_floating {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  box-shadow: 0.25rem 0.25rem 1rem 0 rgba(4, 9, 26, 0.16);
  background: var(--bg_01_80);
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
  color: var(--white-w_100-sec);
}
.btn_toggle_floating:hover:not(.selected):not(.card_selected):not(.hover):not(.disabled), .btn_toggle_floating.hover {
  background: var(--btn-btn_hover);
  border: none;
  box-shadow: inset 0 0 0.75rem rgba(39, 212, 255, 0.5);
  color: var(--white-w_100);
}
.btn_toggle_floating.selected {
  background: var(--btn-btn_default);
  border: none;
  box-shadow: inset 0 0 0.75rem #0476FF;
  color: var(--white-w_100);
}
.btn_toggle_floating.card_selected {
  background: var(--tab-btn_default);
  border: none;
  box-shadow: inset 0 0 0.75rem #0476FF;
  color: var(--white-w_100);
}
.btn_toggle_floating.disabled {
  background: var(--bg_01_80);
  border: 0.063rem solid var(--line-wh_12-to-100);
  box-shadow: none;
  color: var(--white-w_20);
}
.btn_toggle_floating:hover, .btn_toggle_floating:focus {
  border-radius: 0 !important;
}
.btn_toggle_floating.disabled {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  border: 0.063rem solid var(--line-wh_12-to-100);
  background: var(--bg_01_80);
  box-shadow: none;
  color: var(--white-w_20);
}
.btn_toggle_floating.selected {
  background: var(--btn-btn_default);
  box-shadow: inset 0 0 0.75rem #0476FF;
  border: none;
  -webkit-backdrop-filter: unset;
          backdrop-filter: unset;
}

.btn_toggle_footer {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  font-size: 0.875rem;
  font-weight: 400;
  background: rgba(10, 11, 20, 0.4);
  border: 0.063rem solid rgba(255, 255, 255, 0.2);
}
.btn_toggle_footer.selected, .btn_toggle_footer:hover, .btn_toggle_footer:focus {
  background: rgba(39, 212, 255, 0.2);
  border: 0.063rem solid rgba(255, 255, 255, 0.12);
  color: #27D4FF;
}

.btn_toggle_ffb {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  box-shadow: 0.25rem 0.25rem 1rem 0 rgba(4, 9, 26, 0.16);
  font-size: 0.875rem;
  font-weight: 500;
  background: var(--bg_01_80);
  border: 0.063rem solid var(--line-wh_12-to-40);
  color: var(--white-w_87);
}
.btn_toggle_ffb:hover:not(.selected):not(.disabled), .btn_toggle_ffb.hover {
  background: var(--primary-pri_12);
  color: var(--primary-pri_100);
  border: 0.063rem solid var(--line-wh_12-to-40);
  font-weight: 700;
}
.btn_toggle_ffb.selected {
  background: var(--primary-pri_20);
  border: 0.063rem solid var(--line-wh_12-to-40);
  color: var(--primary-pri_100);
  font-weight: 700;
}
.btn_toggle_ffb.disabled {
  background: var(--bg_01_40);
  border: 0.063rem solid var(--white-w_12);
  color: var(--white-w_20);
}
.btn_toggle_ffb.disabled {
  border: 0.063rem solid rgba(255, 255, 255, 0.12);
  background: rgba(10, 11, 20, 0.4);
  box-shadow: none;
  color: rgba(255, 255, 255, 0.38);
}

.btn_toggle_icon {
  font-size: 0.875rem;
  font-weight: 400;
  display: flex;
  align-items: center;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  line-height: 1.75rem;
  color: var(--white-w_87);
}
.btn_toggle_icon.legend:hover:not(.legend), .btn_toggle_icon.legend:active:not(.legend), .btn_toggle_icon.legend.selected {
  color: transparent;
}
.btn_toggle_icon:hover:not(.legend):not(.disabled), .btn_toggle_icon:focus:not(.disabled), .btn_toggle_icon:active:not(.disabled), .btn_toggle_icon.selected {
  color: var(--primary-pri_100);
}
.btn_toggle_icon.disabled {
  opacity: 0.6;
}

.img_selected {
  display: none;
}

.on .img_off {
  display: none;
}
.on .img_selected {
  display: block;
}

.btn_icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  gap: 0.25rem;
  min-width: 2.5rem;
  padding: 0 0.5rem;
  font-weight: 500;
  color: var(--white-w_87-sec) !important;
}
.btn_icon .word {
  color: var(--white-w_87-sec) !important;
}
.btn_icon .word_grey {
  color: var(--white-w_60) !important;
}
.btn_icon:hover:not(.disabled) .word, .btn_icon.selected .word {
  opacity: 1;
  color: var(--primary-pri_100) !important;
  font-weight: 700;
}
.btn_icon:hover:not(.disabled) .word_grey, .btn_icon.selected .word_grey {
  opacity: 1;
  color: var(--primary-pri_100) !important;
  font-weight: 700;
}
.btn_icon.btn_l {
  padding: 0 1.25rem;
}
.btn_icon.large {
  min-width: auto;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0;
}
.btn_icon.medium {
  min-width: auto;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
}
.btn_icon.mini {
  min-width: auto;
  width: 1.5rem;
  height: 1.5rem;
  padding: 0;
}
.btn_icon.xmini {
  min-width: auto;
  width: 1.25rem;
  height: 1.25rem;
  padding: 0;
}
.btn_icon .word {
  font-size: 0.875rem;
  font-weight: 500;
  padding: 0;
  color: var(--white-w_87-sec) !important;
}

.icon_primary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  background: var(--PRI);
  color: var(--white-w_100);
  border-radius: 8px;
  width: auto;
}
.icon_primary.disabled {
  background: var(--white-w_12);
  box-shadow: inset 0 0 0.75rem rgba(255, 255, 255, 0.1);
  color: var(--white-w_20);
}

.icon_ffb {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  box-shadow: 0.25rem 0.25rem 1rem 0 rgba(4, 9, 26, 0.16);
  background: var(--bg_01_80);
  border: 0.063rem solid var(--line-wh_12-to-100);
  z-index: 1;
}
.icon_ffb:hover, .icon_ffb.selected {
  border: 0.063rem solid var(--line-wh_12-to-100);
}
.icon_ffb.line {
  border: 0.063rem solid var(--white-w_12);
  background: var(--bg_01_80);
  -webkit-backdrop-filter: unset;
          backdrop-filter: unset;
}
.icon_ffb.disabled {
  opacity: 0.6;
}

.icon_ghost {
  background: transparent;
}

.btn_xl {
  height: 48px;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.031rem;
}

.btn_l {
  height: 40px;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.031rem;
}

.btn_m {
  height: 32px;
  font-weight: 700;
  font-size: 14px;
}

.btn_s {
  height: 28px;
  width: auto;
  padding: 10px 8px;
}

.btn_ms {
  height: 1.75rem;
  width: auto;
  padding: 0.1rem 0.5rem 0;
}

.btn_ss {
  height: 1.5rem;
  font-size: 0.75rem;
  width: auto;
  padding: 0.1rem 0.75rem 0;
}

.btn_xs {
  height: 1.5rem;
  font-size: 0.75rem;
  width: auto;
  padding: 0.1rem 0.5rem 0;
}

.btn_flexible {
  width: auto;
}

.btn_auto {
  min-width: auto !important;
}

.btn_s_w28h28 {
  width: 1.75rem;
  height: 1.75rem;
  padding: 0.25rem;
}

.btn_s_h28 {
  height: 1.75rem;
  width: auto;
  padding: 0.25rem 0.5rem;
}
.btn_s_h28 .word {
  font-size: 0.8125rem;
  font-weight: 500;
}

.btn_arrow_circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  overflow: hidden;
  background: transparent;
  border-radius: 100%;
}
.btn_arrow_circle:hover:not(.hover):not(.disabled), .btn_arrow_circle:focus:not(.hover):not(.disabled):not(.selected), .btn_arrow_circle.selected {
  background: var(--white-w_16);
}
.btn_arrow_circle.disabled {
  background: transparent;
}
.btn_arrow_circle.disabled img {
  opacity: 0.2 !important;
}
.btn_arrow_circle.line {
  background: var(--bg_02_60);
  border: 0.125rem solid var(--white-w_60);
}
.btn_arrow_circle.line:hover:not(.hover):not(.disabled), .btn_arrow_circle.line:active:not(.hover):not(.disabled), .btn_arrow_circle.line.selected {
  background: var(--primary-pri_20);
  border: 0.125rem solid var(--primary-pri_100);
}
.btn_arrow_circle.line.disabled {
  border: 0.125rem solid var(--white-w_20);
}

.btn_arrow_s {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  overflow: hidden;
  background: var(--white-w_12);
  border-radius: 0.125rem;
}
.btn_arrow_s:hover:not(.hover), .btn_arrow_s:active, .btn_arrow_s.selected, .btn_arrow_s.hover {
  background: var(--white-w_16);
}

.btn_arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 2.5rem;
  overflow: hidden;
  background: var(--bg_01_80);
  border: 0.063rem solid var(--line-wh_20-to-100);
  border-radius: 0.125rem;
}
.btn_arrow:hover:not(.hover):not(.disabled), .btn_arrow.hover, .btn_arrow:focus, .btn_arrow.selected {
  background: var(--primary-pri_12);
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
}
.btn_arrow.disabled {
  background: var(--bg_01_80);
  border: 0.063rem solid var(--line-wh_12-to-100);
}
.btn_arrow.disabled img {
  opacity: 0.2 !important;
}

.btn_arrow_l {
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0.25rem 0.25rem 1rem 0 rgba(4, 9, 26, 0.16);
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  border-radius: 0.25rem;
  width: 1.75rem;
  height: 4.625rem;
  overflow: hidden;
  background: var(--bg_01_80);
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
}
.btn_arrow_l:hover, .btn_arrow_l.hover, .btn_arrow_l.selected {
  background: var(--primary-pri_12);
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
}
.btn_arrow_l.left {
  border-radius: 0.25rem 0 0 0.25rem;
}
.btn_arrow_l.right {
  border-radius: 0 0.25rem 0.25rem 0;
}
.btn_arrow_l.disabled {
  background: var(--bg_01_80);
  border: 0.063rem solid rgba(255, 255, 255, 0.12);
}
.btn_arrow_l.disabled img {
  opacity: 0.2 !important;
}

.put_drop {
  width: 1.25rem;
  height: 1.25rem;
  cursor: pointer;
}
.put_drop.up {
  transform: rotate(180deg);
}
.put_drop.down {
  transform: rotate(180deg);
}

.btn_drop {
  width: 9.625rem;
  justify-content: space-between;
  -moz-column-gap: 0.25rem;
       column-gap: 0.25rem;
}
.btn_drop.disabled {
  background: var(--bg_01_80);
  border: 0.063rem solid var(--line-wh_12-to-100);
  color: var(--white-w_20);
}
.btn_drop.disabled .put_drop img, .btn_drop.disabled .put_see img {
  filter: brightness(0) saturate(100%) invert(100%) sepia(5%) saturate(0%) hue-rotate(72deg) brightness(103%) contrast(102%);
  opacity: 0.3;
}
.btn_drop.selected .put_drop {
  transform: rotate(180deg);
}
.btn_drop.selected .put_drop.down {
  transform: rotate(0deg);
}
.btn_drop .word {
  font-size: 0.875rem;
  font-weight: 500;
  width: calc(100% - 1.25rem);
}
.btn_drop .drop_word {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--grade-chart-gco-01);
  width: calc(100% - 1.25rem);
}

.drop_wrap {
  position: relative;
}
.drop_wrap .drop_content {
  position: absolute;
  left: 0;
  top: 2.5rem;
  z-index: 100;
}
.drop_wrap.on .drop_content {
  display: block;
}

.circle_grey28 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  overflow: hidden;
  border-radius: 100%;
  padding: 0;
  background-color: var(--white-w_20);
}
.circle_grey28 + .word {
  font-size: 0.75rem;
  font-weight: 400;
}
.circle_grey28.popover {
  background-color: rgba(74, 78, 102, 0.8);
}
.circle_grey28.map {
  background-color: #0068E6;
  border: 0.063rem solid rgba(0, 0, 0, 0.3);
}

.circle16, .circle32, .circle48, .circle64 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  overflow: hidden;
  border-radius: 100%;
  padding: 0;
  background-color: transparent;
}
.circle16 + .word, .circle32 + .word, .circle48 + .word, .circle64 + .word {
  font-size: 0.875rem;
  font-weight: 400;
}

.circle16 {
  width: 1rem;
  height: 1rem;
}

.circle48 {
  width: 3rem;
  height: 3rem;
}

.circle64 {
  width: 4rem;
  height: 4rem;
}

.circle_grey32 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  overflow: hidden;
  border-radius: 100%;
  padding: 0;
  background-color: rgba(255, 255, 255, 0.2);
}
.circle_grey32 + .word {
  font-size: 0.875rem;
  font-weight: 400;
}
.circle_grey32.line {
  background-color: transparent;
  border: 0.063rem solid var(--white-w_12);
}
.circle_grey32 + .word_medium {
  font-size: 0.875rem;
  font-weight: 500;
}
.circle_grey32 + .word_medium.selected, .circle_grey32 + .word_medium:hover {
  font-weight: 700;
}

.tab_line {
  display: flex;
  align-items: center;
}
.tab_line button {
  margin-right: -0.063rem;
  border-radius: 0;
}
.tab_line button:first-child {
  border-radius: 0.125rem 0 0 0.125rem;
}
.tab_line button:last-child {
  border-radius: 0 0.125rem 0.125rem 0;
}
.tab_line.spacing {
  gap: 0.125rem;
}
.tab_line.spacing button {
  margin: 0;
  border-radius: 0.125rem;
}

.connect_line {
  display: flex;
  align-items: center;
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  box-shadow: 0.25rem 0.25rem 1rem 0 rgba(4, 9, 26, 0.16);
  background: var(--bg_01_80);
  border: 0.063rem solid var(--line-wh_12-to-100);
  padding: 0 0.5rem;
  border-radius: 0.125rem;
  position: relative;
  overflow: hidden;
}
.connect_line.rounding {
  height: 4rem;
  padding: 0 0.25rem;
  background: rgba(10, 11, 20, 0.4);
  -webkit-backdrop-filter: blur(1.875rem);
          backdrop-filter: blur(1.875rem);
  border-radius: 4rem;
}
.connect_line.rounding button {
  padding: 0 1rem;
}
.connect_line.box {
  padding: 0.75rem 1.25rem;
  -moz-column-gap: 1.25rem;
       column-gap: 1.25rem;
}
.connect_line.big_box {
  padding: 0.75rem 0.75rem 0.75rem 1.25rem;
  -moz-column-gap: 1.25rem;
       column-gap: 1.25rem;
}
.connect_line.more {
  padding: 0.375rem 0.75rem;
}
.connect_line.sky {
  border: 0.063rem solid var(--line-pri_40-to-wh_100);
}
.connect_line.none_shadow {
  box-shadow: unset;
}
.connect_line .shadow {
  position: absolute;
  width: 5.25rem;
  padding: 0.5rem;
}
.connect_line .shadow.left {
  left: 0;
  top: 0;
  background: linear-gradient(90deg, var(--bg_02) 36%, rgba(4, 9, 26, 0) 100%);
}
.connect_line .shadow.right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  right: 0;
  top: 0;
  background: linear-gradient(270deg, var(--bg_02) 36%, rgba(4, 9, 26, 0) 100%);
}
.connect_line button {
  background: none !important;
}

.shadow {
  display: flex;
  align-items: center;
  height: 100%;
}

.horizon_line {
  white-space: nowrap;
}
.horizon_line .horibox {
  display: inline-block;
}

.horibox .a_link {
  display: block;
}

.arrow_box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  background: var(--white-w_12);
  border-radius: 0.125rem;
  cursor: pointer;
}
.arrow_box:hover, .arrow_box:focus {
  background: var(--white-w_16);
}

/*controll bar*/
.control_line {
  display: flex;
  align-items: center;
}
.control_line.mini {
  width: 10rem;
}
.control_line.mini .progress_box {
  width: 7rem;
  height: 1.5rem;
}
.control_line.mini .progress_box .bar {
  width: 5.5rem;
}
.control_line .btn_icon:first-child {
  margin-right: -0.063rem;
}
.control_line .btn_icon:last-child {
  margin-left: -0.063rem;
}
.control_line .icon_ffb {
  box-shadow: unset;
}

.timeline_outline {
  height: 1.25rem;
  padding: 0.125rem 0.3125rem;
  background: rgba(10, 11, 20, 0.4);
  border-width: 0.063rem 0;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.12);
}

.progress_box {
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  width: 8rem;
  height: 2.25rem;
  padding: 0 0.625rem;
  position: relative;
  border: 0.063rem solid var(--line-wh_12-to-100);
  background: var(--bg_01_80);
}
.progress_box .bar {
  border-radius: 0.125rem;
  width: 6.5rem;
  height: 0.25rem;
  overflow: hidden;
  margin: 0 auto;
  background: var(--primary-pri_20);
  cursor: pointer !important;
}
.progress_box.line {
  border: 0.063rem solid var(--white-w_12);
}

.scrubber {
  border-radius: 0.125rem;
  background: rgba(39, 212, 255, 0.2);
}
.scrubber .empty {
  position: absolute;
  width: 0.375rem;
  height: 0.875rem;
  top: 0.25rem;
  left: 0.625rem;
  top: 50%;
  margin-top: -0.438rem;
  background: var(--primary-pri_100);
  border-radius: 0.375rem;
  cursor: pointer !important;
}

.progress.white {
  border-radius: 0.125rem;
  background: var(--primary-pri_100);
}

.translate3d_100 {
  transform: translate3d(0.063rem, 0, 0);
}

/*controll bar End*/
.a_link {
  font-size: 0.875rem;
  font-weight: 500;
  padding: 0.625rem 1rem;
  cursor: pointer;
  color: var(--more-visible-wh_60-to-100);
  line-height: 1;
}
.a_link:hover, .a_link:focus {
  color: var(--more-visible-wh_60-to-100);
}
.a_link.selected {
  color: var(--primary-pri_100);
  font-weight: 700;
}
.a_link.disabled {
  color: rgba(255, 255, 255, 0.38);
}
.a_link.more {
  font-size: 1rem;
  font-weight: 700;
}
.a_link.short {
  padding: 0.625rem 0.75rem;
}
.a_link.pad12 {
  padding: 0.625rem 0.75rem;
}

.vtline_20 {
  display: inline-block;
  width: 0.063rem;
  height: 1.25rem;
  background: var(--primary-pri_20);
}

.btn_etc {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
}

.etc_zone {
  position: relative;
  width: 1.5rem;
  height: 1.5rem;
}
.etc_zone .connect_etc {
  position: absolute;
  right: -0.8rem;
  top: 2.6rem;
  z-index: 100;
}
.etc_zone .connect_etc a {
  display: block;
}

.connect_etc {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  border-radius: 0.125rem;
  background: rgba(39, 212, 255, 0.05);
  border: 0.063rem solid rgba(255, 255, 255, 0.12);
  padding: 0.125rem 0.5rem;
}

.swith_room {
  width: 2.5rem;
  height: 1.5rem;
}

.switch_checkbox {
  height: 0;
  width: 0;
  visibility: hidden;
  display: none !important;
}

.switch_label {
  display: flex;
  align-items: center;
  cursor: pointer;
  width: 2.5rem;
  height: 1.5rem;
  background: var(--white-w_16);
  border-radius: 2rem;
  position: relative;
  transition: 0.2s;
}
.switch_label.fill_line {
  background: var(--more-visible-wh_20-to-12);
  border: 0.063rem solid var(--white-w_60);
}
.switch_label.fill_line .switch_button {
  background: var(--white-w_60);
}
.switch_label.line {
  background: transparent;
  border: 0.063rem solid var(--white-w_60);
}
.switch_label.line .switch_button {
  background: var(--white-w_60);
}

.switch_label .switch_button {
  content: "";
  position: absolute;
  top: 50%;
  margin-top: -0.5rem;
  left: 0.25rem;
  width: 1rem;
  height: 1rem;
  border-radius: 100%;
  transition: 0.2s;
  background: var(--white-w_40);
}

.swith_room.on .switch_label {
  background: #0068E6;
}

.swith_room.on .fill_line {
  background: var(--primary-pri_20);
  border: 0.063rem solid var(--primary-pri_100);
}

.swith_room.on .line {
  background: transparent;
  border: 0.063rem solid var(--primary-pri_100);
}

.swith_room.on .switch_label .switch_button {
  left: calc(100% - 0.25rem);
  transform: translateX(-100%);
  background: #fff;
}

.swith_room.on .fill_line .switch_button {
  background: var(--primary-pri_100);
}

.swith_room.on .line .switch_button {
  background: var(--primary-pri_100);
}

.put_zone {
  position: relative;
}
.put_zone .wrput {
  width: 100%;
}
.put_zone .wrput.large + .put_check {
  top: 0.875rem;
  right: 1rem;
}
.put_zone .wrput.large + .put_see {
  top: 0.7rem;
  right: 0.875rem;
}
.put_zone .put_check {
  position: absolute;
  right: 0.75rem;
  top: 0.5rem;
  display: none;
}
.put_zone .put_check.dflx {
  display: flex;
}
.put_zone .timer {
  position: absolute;
  top: 17px;
  right: 16px;
  margin-right: auto;
  color: rgba(255, 255, 255, 0.4);
  font-size: 12px;
  font-weight: 400;
}
.put_zone .put_see {
  top: 0.25rem;
  display: flex;
}
.put_zone .mess {
  margin: 0.5rem 0 0;
}
.put_zone.normal .mess {
  display: none;
}
.put_zone .srch_put {
  flex: 1;
}

.wrput {
  font-size: 1rem;
  font-weight: 400;
  width: 200px;
  background-color: transparent;
  border: 1px solid var(--alpha-bk-to-whbk-20);
  border-radius: 4px;
  color: rgba(255, 255, 255, 0.4);
  line-height: 1;
  letter-spacing: 0.5px;
  padding: 0 12px 0 16px;
}
.wrput ::-moz-placeholder {
  color: var(--alpha-bk-to-whbk-40) !important;
}
.wrput ::placeholder {
  color: var(--alpha-bk-to-whbk-40) !important;
}
.wrput.on, .wrput:focus:not(.disabled) {
  border: 1px solid var(--PRI) !important;
  color: var(--alpha-bk-to-whbk-87);
}
.wrput.large {
  width: 100%;
  height: 48px;
}
.wrput.medium {
  font-size: 0.875rem;
  font-weight: 400;
  width: 100%;
  height: 40px;
  padding: 0 8px 0 12px;
}
.wrput.small {
  font-size: 0.875rem;
  font-weight: 400;
  width: 100%;
  height: 28px;
  padding: 0 8px 0 12px;
}
.wrput.disabled {
  border: 1px solid var(--alpha-bk-to-whbk-20);
  background: var(--alpha-bk-to-whbk-20);
}

.sp_name {
  font-size: 0.8125rem;
  font-weight: 400;
  padding: 0 0.5rem;
}
.sp_name.pink {
  color: #FF00FF;
}

.put_check {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0.75rem;
  height: 0.75rem;
}
.put_check.green {
  background-image: url("../images/check_green.svg");
  background-size: 1.25rem auto;
}

.put_delete {
  cursor: pointer;
}
.put_delete.on {
  display: block;
}

.img_see_off {
  display: none;
}

.put_see {
  width: 1.25rem;
  height: 1.25rem;
  cursor: pointer;
}
.put_see.on .img_see {
  display: none;
}
.put_see.on .img_see_off {
  display: block;
}

.img_down {
  display: none;
}

.put_drop {
  width: 1.25rem;
  height: 1.25rem;
  cursor: pointer;
}
.put_drop.on .img_up {
  display: none;
}
.put_drop.on .img_down {
  display: block;
}

.mess {
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.2;
  color: rgba(0, 0, 0, 0.7);
}
.mess.on {
  display: block;
}
.mess.error {
  color: #FF1F55;
}

.btn_srch {
  font-size: 0.875rem;
  font-weight: 400;
  min-width: 3.625rem;
  height: 2rem;
  padding: 0 0.75rem;
  background: #5C5E66;
  box-shadow: 0 0 0.063rem rgba(0, 0, 0, 0.16);
  border-radius: 0.25rem;
  color: #fff;
  transition: 0.2s all;
}
.btn_srch:hover, .btn_srch:focus {
  background: #45464D;
}
.btn_srch.bldark {
  background: #004099;
}
.btn_srch.bldark.on, .btn_srch.bldark:hover, .btn_srch.bldark:focus {
  background: #003580;
}
.btn_srch.more {
  padding: 0 1rem;
}
.btn_srch.med {
  min-width: 8.875rem;
}
.btn_srch.wht {
  background: #fff;
  border: 0.063rem solid #dcdde0;
  color: #000;
}
.btn_srch.wht.on, .btn_srch.wht:hover, .btn_srch.wht:focus {
  background: #e6e7eb;
}

.textarea {
  width: 100%;
  height: 100%;
  resize: none;
}

.temrs_text_wrap {
  background: var(--more-bright-wh_12-to-6);
  border-radius: 0.125rem;
  padding: 0.5rem 0.5rem 0.5rem 0.75rem;
  position: relative;
}
.temrs_text_wrap.line {
  background: transparent;
  border: 0.063rem solid var(--white-w_40);
}
.temrs_text_wrap.line_fill {
  background: var(--more-bright-wh_12-to-6);
  border: 0.063rem solid var(--white-w_20);
}
.temrs_text_wrap.line_fill.pad12 {
  padding: 0.75rem 0.5rem 0.75rem 1rem;
}

.terms_area {
  width: 100%;
  height: 4.25rem;
  background: transparent;
  padding-right: 0.375rem;
  overflow: auto;
  font-size: 0.8125rem;
  color: var(--white-w_87-sec);
  line-height: 1.4;
  resize: none;
}
.terms_area.edit {
  padding: 0.5rem;
  height: 10.5rem;
}

.input_sett {
  display: flex;
  align-items: center;
  position: relative;
}

.btn_srch28 {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  font-weight: 400;
  border-radius: 0.125rem;
  color: var(--white-w_40);
  width: 1.75rem;
  height: 1.75rem;
  background-color: var(--white-w_12);
  text-indent: -9999px;
}
.btn_srch28:hover:not(.selected):not(.on):not(.disabled), .btn_srch28.selected {
  background-color: var(--white-w_16);
}
.btn_srch28.shadow {
  box-shadow: inset 0 0 0.75rem rgba(255, 255, 255, 0.1);
}
.btn_srch28.on, .btn_srch28:active:not(.selected):not(.on):not(.disabled) {
  color: var(--white-w_100);
  background-color: var(--btn-btn_selected);
}
.btn_srch28.on span, .btn_srch28:active:not(.selected):not(.on):not(.disabled) span {
  opacity: 1 !important;
}
.btn_srch28.word {
  width: auto;
  min-width: 1.75rem;
  padding: 0 0.5rem;
  text-indent: 0;
}
.btn_srch28.srch.on, .btn_srch28.srch:active:not(.selected):not(.on) {
  color: var(--white-w_100);
  background-color: var(--btn-btn_default);
}
.btn_srch28.srch.on span, .btn_srch28.srch:active:not(.selected):not(.on) span {
  opacity: 1 !important;
}
.btn_srch28.disabled {
  opacity: 0.6;
}

.srch_line {
  display: flex;
  align-items: center;
  -moz-column-gap: 0.25rem;
       column-gap: 0.25rem;
}

.srch_zone {
  display: flex;
  align-items: center;
  border-radius: 0.125rem;
  width: 12.5rem;
  height: 1.75rem;
  padding: 0.25rem 0.5rem;
  background: var(--more-visible-wh_12-to-6);
}
.srch_zone.on {
  border: 0.063rem solid var(--primary-pri_100) !important;
  outline: 0.188rem solid var(--primary-pri_20);
}
.srch_zone.line {
  background-color: transparent;
  border: 0.063rem solid var(--white-w_40);
}

.bt_srch {
  width: 1rem;
  height: 1rem;
  background: url(../images/search_fff_16.svg) no-repeat center center;
  background-size: contain;
  text-indent: -99999px;
}

.srch_put {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--white-w_40);
  background: transparent;
  width: calc(100% - 1rem);
  width: 100%;
  padding: 0 0 0 0.25rem;
  line-height: 1;
  color: var(--white-w_87-sec);
}

.pos_rel {
  position: relative !important;
}

.srch_brd {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  display: none;
  position: absolute;
  left: 0;
  bottom: 2rem;
  width: 15rem;
  padding: 0.5rem 0;
  border: 0.063rem solid var(--line-pri_40-to-bk_40);
  background-color: var(--bg_01_80);
  z-index: 400;
}
.srch_brd.on {
  display: block;
}
.srch_brd.bottom_box {
  bottom: unset;
}

.srch_ul {
  width: 100%;
}
.srch_ul li {
  display: flex;
  align-items: center;
  height: 1.75rem;
  padding: 0.375rem 0.5rem 0.3125rem 1rem;
  cursor: pointer;
}
.srch_ul li .p_val {
  font-size: 0.875rem;
  font-weight: 400;
  width: 100%;
}
.srch_ul li:hover, .srch_ul li:focus {
  background-color: var(--primary-pri_20);
}
.srch_ul li:hover .p_val, .srch_ul li:focus .p_val {
  border-right: 0.25rem solid rgba(255, 255, 255, 0.5);
}
.srch_ul li:hover .p_val.on, .srch_ul li:focus .p_val.on {
  border-right: 0.25rem solid rgba(255, 255, 255, 0.5);
}
.srch_ul.hover li.on {
  background-color: var(--primary-pri_20);
}
.srch_ul.hover li.on .p_val {
  border-right: 0.25rem solid rgba(255, 255, 255, 0.5);
}

.login_input {
  width: 320px;
}

.save_group {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1rem 0;
}

.save_line {
  display: flex;
  align-items: center;
}
.save_line label {
  font-size: 0.8125rem;
  font-weight: 400;
}

.pw_initial a {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--white-w_87-sec);
  cursor: pointer;
}

.pop_rcd_dl {
  display: flex;
  width: 100%;
  margin: 0 0 0.5rem;
}
.pop_rcd_dl dt {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--more-visible-wh_60-to-100);
  width: 4.5rem;
  padding: 0.375rem 0.5rem 0 0;
}
.pop_rcd_dl dd {
  flex: 1;
}
.pop_rcd_dl dd .selector {
  width: 100%;
}

.selector {
  font-size: 0.875rem;
  font-weight: 400;
  border-radius: 0.125rem;
  width: 13.5rem;
  height: 1.75rem;
  padding: 0.1rem 1.5rem 0 0.75rem;
  color: var(--white-w_87);
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: var(--bg_01_80);
  border: 0.063rem solid var(--white-w_40);
  background-image: url(../images/arrow_down_grey16.svg);
  background-repeat: no-repeat;
  background-position: 98% 56%;
  background-size: 1rem 1rem;
  cursor: pointer;
}
.selector.nobord {
  width: 10rem;
  border: none;
}
.selector.fill {
  background-color: var(--more-bright-wh_12-to-6);
  border: 0.063rem solid transparent;
}
.selector.fill option {
  color: #000;
}
.selector.sm {
  font-size: 0.8125rem;
  font-weight: 400;
  width: 7.5rem;
  background-size: 1rem 1rem;
}
.selector.sm.color {
  width: 4.5rem;
  background: var(--white-w_12);
  border: 0.063rem solid transparent;
  padding: 0.1rem 1rem 0 0.5rem;
  background-image: url(../images/arrow_down_grey16.svg);
  background-repeat: no-repeat;
  background-position: 93% 42%;
  background-size: 1rem 1rem;
}
.selector.sm.color option {
  color: #000;
}
.selector.on, .selector:focus {
  border: 0.063rem solid var(--primary-pri_100) !important;
  outline: 0.188rem solid var(--primary-pri_20);
}
.selector.detail {
  background-color: transparent;
}
.selector.detail option {
  color: #000;
}

.editor_wrap {
  width: 100%;
  padding: 1.875rem;
  border: 0.063rem dashed #555;
}

.edit_btline {
  display: flex;
  align-items: center;
  -moz-column-gap: 0.125rem;
       column-gap: 0.125rem;
}

.pipe28 {
  width: 0.063rem;
  height: 1.75rem;
  background: rgba(255, 255, 255, 0.2);
}

.h_tlt {
  font-size: 1rem;
  font-weight: 400;
}

button {
  font-size: 0.8125rem;
  font-weight: 500;
}
button.edit_red {
  color: #FF1F55;
}
button.edit_orange {
  color: #FC5C34;
}
button.edit_yellow {
  color: #FFE043;
}
button.edit_green {
  color: #00BD78;
}
button.edit_blue {
  color: #338FFF;
}
button.edit_white {
  color: #fff;
}

.vms_text_wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

.vms_area {
  width: 30rem;
  height: 6rem;
  background: #0B1129;
  border: 0.063rem solid var(--primary-pri_100);
  outline: 0.188rem solid rgba(39, 212, 255, 0.2);
  border-radius: 0.125rem;
  text-align: center;
  font-size: 2rem;
  font-weight: 400;
  color: #FFE043;
  line-height: 2.6rem;
  padding: 0.3rem 0 0;
}
.vms_area.vms720 {
  width: 45rem;
  height: 9rem;
  padding: 2rem 0 0;
}
.vms_area.vms288 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30rem;
  height: 18rem;
  padding: 2.5rem;
}

.indicator_test {
  width: 100%;
  background-color: var(--bg_01_80);
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
  -webkit-backdrop-filter: blur(1.875rem);
          backdrop-filter: blur(1.875rem);
  width: 20rem;
  padding: 1.25rem 1.25rem 1.25rem;
  background: var(--bg_01_80);
  overflow: hidden;
}
.indicator_test .indi_top {
  padding: 1.25rem 1.25rem 1.25rem;
  margin: 0 0 1rem;
}
.indicator_test .indi_shadow {
  box-shadow: 0.25rem 0.25rem 1rem 0 rgba(4, 9, 26, 0.16);
}
.indicator_test.donot {
  background-image: url("../../assets/images/do_not_line.svg");
  background-repeat: no-repeat;
  width: 19.875rem;
}
.indicator_test.lay_donot {
  height: 8.625rem !important;
  background-image: url("../../assets/images/lay_do_not_line.svg");
}

.indicator {
  width: 100%;
  background-color: var(--bg_01_80);
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
  -webkit-backdrop-filter: blur(1.875rem);
          backdrop-filter: blur(1.875rem);
  width: 20rem;
  padding: 1.25rem 1.25rem 1.25rem;
  background: var(--bg_01_80);
  overflow: hidden;
}
.indicator.overt {
  padding: 1.25rem 0.5rem 0rem 1.25rem;
}
.indicator.overt .indi_top {
  margin: 0 0 1rem;
}
.indicator.overt .indi_conts {
  margin: 0;
}
.indicator.donot {
  background-image: url("../../assets/images/do_not_line.svg");
  background-repeat: no-repeat;
  background-position: right top;
  background-size: cover;
}
.indicator.lay_donot {
  height: 8.625rem !important;
  background-image: url("../../assets/images/lay_do_not_line.svg");
}

.indicator_shadow {
  width: 100%;
  background-color: var(--bg_01_80);
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
  -webkit-backdrop-filter: blur(1.875rem);
          backdrop-filter: blur(1.875rem);
  box-shadow: 0.25rem 0.25rem 1rem 0 rgba(4, 9, 26, 0.16);
  width: 20rem;
  padding: 1.25rem 1.25rem 1.25rem;
  background: var(--bg_01_80);
  overflow: hidden;
  -webkit-backdrop-filter: unset;
          backdrop-filter: unset;
}
.indicator_shadow.overt {
  padding: 1.25rem 0.5rem 0rem 1.25rem;
}
.indicator_shadow.overt .indi_top {
  margin: 0 0 1rem;
}
.indicator_shadow.overt .indi_conts {
  margin: 0;
}
.indicator_shadow.donot {
  background-image: url("../../assets/images/do_not_line.svg");
  background-repeat: no-repeat;
  background-position: right top;
  background-size: cover;
}
.indicator_shadow.lay_donot {
  height: 8.625rem !important;
  background-image: url("../../assets/images/lay_do_not_line.svg");
  background-repeat: no-repeat;
  background-position: right top;
  background-size: cover;
}

.arr_up {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  cursor: pointer;
}
.arr_up.down {
  transform: rotate(180deg);
}

.indi_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  cursor: pointer;
}
.indi_top h1 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--primary-to-grayscale-to-bk);
  line-height: 1.1;
}
.indi_top .record_menu.hauto li a {
  font-size: 0.875rem;
  font-weight: 700;
  padding: 0;
}
.indi_top.accord {
  padding: 1.25rem 1.25rem 1.25rem;
}
.indi_top.withtab {
  justify-content: unset;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}

.indi_conts {
  width: 100%;
  margin: 1rem 0 0;
}
.indi_conts.del {
  display: none;
}

.indi_etc {
  width: 100%;
  background-color: var(--bg_01_80);
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
  -webkit-backdrop-filter: blur(1.875rem);
          backdrop-filter: blur(1.875rem);
  padding: 0.85rem 0.75rem 0.7rem;
  border-radius: 0.125rem;
  margin: 0 0 0.5rem;
  overflow: hidden;
  cursor: pointer;
}
.indi_etc.on {
  background-color: rgba(0, 104, 230, 0.5);
  box-shadow: 0 0 0.75rem 0 inset #0068e6;
}
.indi_etc .indi_tlt {
  font-size: 0.875rem;
  font-weight: 500;
  text-align: center;
}

.record_menu {
  display: flex;
  align-items: center;
  height: 2.75rem;
  padding: 0 1.25rem 0 0;
  -moz-column-gap: 1.875rem;
       column-gap: 1.875rem;
}
.record_menu li a {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--more-visible-wh_60-to-100);
  display: block;
}
.record_menu li a:hover, .record_menu li a:focus {
  color: var(--primary-pri_100);
}
.record_menu li a.on {
  color: var(--primary-pri_100);
  font-size: 1rem !important;
}
.record_menu li a.selected {
  color: var(--primary-pri_100);
}
.record_menu li a.disabled {
  color: rgba(255, 255, 255, 0.38);
}
.record_menu.hauto li a {
  padding: 0 0 0.75rem;
}
.record_menu.usage li a {
  font-size: 0.875rem;
  font-weight: 500;
  padding: 0 0 0.75rem;
}
.record_menu.main {
  color: var(--white-w_87-sec);
}

.tm_zone {
  width: 13.125rem;
}
.tm_zone.hover {
  border: 0.063rem solid var(--primary-pri_100);
}
.tm_zone.pressed {
  border: 0.063rem solid var(--primary-pri_100);
  background: var(--primary-pri_12);
}

.tm_zone_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 2.25rem;
  background: var(--more-bright-wh_12-to-6);
  padding: 0.25rem 0.25rem 0.25rem 1rem;
  color: var(--white-w_87);
}
.tm_zone_top h1 {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--white-w_87);
}

.tmbox {
  position: relative;
  width: 100%;
  padding: 1rem;
  background-color: var(--more-bright-wh_6-to-60);
  margin: 0 0 0.75rem;
}
.tmbox:last-child {
  margin: 0;
}
.tmbox .start_dl {
  margin-top: -0.5rem;
}
.tmbox.white6 {
  background-color: var(--white-w_6);
}

.tmbox_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  margin: 0 0 0.75rem;
}

.tmbox_date {
  font-size: 0.75rem;
  font-weight: 300;
  color: var(--white-w_60);
  word-break: keep-all;
  margin: 0 0 0.25rem;
  line-height: 1.2;
}

.tm_dl {
  width: 100%;
  color: var(--white-w_87-sec);
}
.tm_dl dt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  margin: 0 0 0.5rem;
}
.tm_dl dt p {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.3;
}
.tm_dl.pattern dt p {
  font-size: 1rem;
  font-weight: 700;
}
.tm_dl dd .badge {
  margin: 0 0 0.25rem;
  min-width: auto;
  letter-spacing: 0.125rem;
}
.tm_dl dd p {
  font-size: 0.8125rem;
  font-weight: 400;
  line-height: 1.4;
}
.tm_dl dd p.pure {
  width: 100%;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.digon_wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
}

.diagon_cont {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 11.375rem;
  height: 5.75rem;
  padding: 0.5rem;
  overflow: hidden;
  background: url(../images/bg_tract.svg) no-repeat left top;
  background-size: 100% 100%;
}
.diagon_cont .diagon_tlt {
  position: absolute;
  left: 0.75rem;
  top: 0.75rem;
}
.diagon_cont .diagon_result {
  padding: 1.5rem 0 0;
}
.diagon_cont.sm {
  justify-content: space-between;
  width: 8.5rem;
  height: 3rem;
  padding: 0.8rem 0.7rem 0.5rem 0.6rem;
  -moz-column-gap: 0.25rem;
       column-gap: 0.25rem;
  background: url(../images/bg_tract_sm.svg) no-repeat left top;
  background-size: 100% 100%;
}
.diagon_cont.sm .diagon_tlt {
  position: static;
}
.diagon_cont.sm .diagon_result {
  text-shadow: none;
  font-size: 1rem;
  padding: 0;
  -moz-column-gap: 0.25rem;
       column-gap: 0.25rem;
}
.diagon_cont.lg {
  width: 12.25rem;
  height: 8.25rem;
  padding: 1rem 0.5rem 0.5rem;
  background: url(../images/bg_tract_lg_.svg) no-repeat left top;
  background-size: 100% 100%;
  flex-direction: column;
}

.diagon_tlt {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--primary-pri_100);
}
.diagon_tlt.cover {
  width: 86%;
  padding: 0.75rem 0 0 0.75rem;
  background: url(../images/bg_tract_top.svg) no-repeat left top;
  background-size: 100% auto;
}

.diagon_result {
  display: flex;
  align-items: flex-end;
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--primary-pri_100);
  -moz-column-gap: 0.375rem;
       column-gap: 0.375rem;
}
.diagon_result .unit {
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.7;
}

.indi_share {
  display: flex;
  align-items: center;
  justify-content: space-between;
  -moz-column-gap: 0.25rem;
       column-gap: 0.25rem;
  width: 100%;
  margin: 0 0 1rem;
}

.indi_dl {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 4.25rem;
  height: 4.25rem;
  overflow: hidden;
  padding: 0.25rem 0.25rem 0.125rem;
  text-align: center;
  border-radius: 0.125rem;
  border: 0.063rem solid var(--primary-pri_100);
  background-color: var(--etc-bg);
}
.indi_dl.nobord {
  border: none;
}
.indi_dl dt {
  font-size: 1.25rem;
  font-weight: 700;
  display: flex;
  align-items: flex-end;
  color: var(--primary-pri_100);
  margin: 0.25rem 0 0 0;
}
.indi_dl dt .unit {
  font-size: 0.875rem;
  font-weight: 400;
  color: var(--primary-pri_60);
  margin: 0 0 0 0.125rem;
}
.indi_dl dd {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--primary-pri_100);
}
.indi_dl.half {
  width: 50%;
  height: 5.25rem;
}
.indi_dl.third {
  height: 3rem;
  width: 33.333%;
}
.indi_dl.third dt {
  font-size: 1rem;
  font-weight: 700;
}
.indi_dl.green {
  border: 0.063rem solid #1CBD6D;
}
.indi_dl.green dt, .indi_dl.green dd {
  color: #1CBD6D;
}
.indi_dl.red {
  border: 0.063rem solid #D60000;
}
.indi_dl.red dt, .indi_dl.red dd {
  color: #D60000;
}

.indi_chart {
  width: 100%;
}
.indi_chart img {
  width: 100%;
}

.chart_text {
  font-size: 0.8125rem;
  font-weight: 400;
  width: 100%;
  min-height: 1.375rem;
  padding: 0.25rem 0.125rem 0.125rem;
  text-align: center;
  background-color: var(--white-w_12);
}

.sign_tri2 {
  display: inline-block;
  width: 1.75rem;
  height: 1.75rem;
  cursor: pointer;
}
.sign_tri2.jam {
  background: url(../images/sign_jam_28.svg) no-repeat center center;
  background-size: contain;
}
.sign_tri2.ambulace {
  width: 2.125rem;
  height: 1rem;
  background: url(../images/ambulance.svg) no-repeat center center;
  background-size: contain;
}

.detail_see {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  font-size: 0.75rem;
  font-weight: 300;
  margin: 0.5rem 0 0;
  padding: 0;
  cursor: pointer;
}
.detail_see:hover, .detail_see:focus {
  opacity: 0.8;
}
.detail_see .word {
  color: var(--white-w_87);
}
.detail_see .mark_trig_down12 {
  margin: 0 0 0.1rem 0.25rem;
}

.mark_trig_down12 {
  display: inline-block;
  width: 0.75rem;
  height: 0.75rem;
  background: url("../images/triangle_down12.svg") no-repeat center center;
  background-size: contain;
}

.label_line {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  width: 100%;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
}
.label_line .label {
  margin: 0 0 0.5rem;
}

.map_ex1 {
  width: 100%;
  height: 6.25rem;
  position: relative;
  overflow: hidden;
  margin: 0 0 0.5rem;
}
.map_ex1 img {
  width: 15.5rem;
  height: 6.25rem;
}

.express_wrap {
  width: 100%;
  height: 100%;
  padding: 1.25rem;
  background-color: var(--more-bright-wh_6-to-60);
  display: flex;
  flex-direction: column;
}
.express_wrap.example {
  width: 60rem;
  height: 27rem;
}
.express_wrap.primary {
  padding: 0.75rem;
  border-radius: 0.125rem;
}
.express_wrap.primary .monit_top {
  padding: 0 0 0.5rem;
}
.express_wrap.hover {
  border: 0.063rem solid var(--primary-pri_100);
}
.express_wrap.pressed {
  border: 0.063rem solid var(--primary-pri_100);
  background: var(--primary-pri_12);
}

.primary_bg {
  width: 100%;
  background-color: var(--bg_01_80);
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
  -webkit-backdrop-filter: blur(1.875rem);
          backdrop-filter: blur(1.875rem);
}

.monit_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 0 1rem;
}
.monit_top h1 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--white-w_87);
}
.monit_top h2 {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--white-w_87);
}

.exp_cont {
  width: 100%;
  min-height: 6.875rem;
  padding: 1rem;
  background-color: var(--more-bright-wh_6-to-60);
  overflow: hidden;
  font-size: 0.875rem;
  font-weight: 400;
}
.exp_cont.hauto {
  min-height: auto;
}
.exp_cont.box {
  background-color: var(--white-w_6);
}
.exp_cont.height52 {
  min-height: 3.25rem;
  background-color: var(--white-w_6);
}

.exp_cont_text {
  color: var(--primary-pri_100);
}

.express_cont {
  width: 100%;
  height: calc(100% - 2.25rem);
}

.express_board {
  width: 100%;
  margin: 0 0 0.5rem;
}

.exp_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
  width: 100%;
  height: 2.5rem;
  background-color: var(--more-bright-wh_12-to-6);
  padding: 0 0.75rem;
}

.layout_box {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  padding: 0 1.25rem 1.25rem 1.25rem;
  width: auto;
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
  background: var(--bg_01_80);
}
.layout_box.four {
  width: 40rem;
}

.layout_top {
  font-size: 0.875rem;
  font-weight: 700;
  padding: 1.25rem 1rem 1rem 0;
  color: var(--primary-to-grayscale-to-bk);
}

.layout_boxes {
  display: flex;
  align-items: center;
  justify-content: space-between;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
  width: 100%;
  height: 2.5rem;
  background-color: var(--white-w_6);
  padding: 0 0.75rem;
}

.exp_dl {
  display: flex;
  align-items: center;
}
.exp_dl dt {
  font-size: 0.8125rem;
  font-weight: 400;
  width: 3.75rem;
  padding: 0 0.5rem 0 0;
}
.exp_dl dd {
  flex: 1;
}

.pressed {
  width: 100%;
  height: 100%;
  background: var(--primary-pri_6);
  border: 0.063rem solid var(--primary-pri_100);
}

.line_contain {
  width: 100%;
  background-color: var(--bg_01_80);
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
  backdrop-filter: blur(1.875rem);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.line_contain.box {
  width: 28.625rem;
  flex: none;
}

.line_inner {
  width: 100%;
  height: calc(100% - 2.625rem);
  padding: 1.25rem;
}

.vert_wrap {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  row-gap: 1.25rem;
  width: 100%;
  height: 100%;
}

.line_bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  -moz-column-gap: 0.75rem;
       column-gap: 0.75rem;
}

.pop_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  width: 100%;
  height: 2.625rem;
  padding: 0.5rem 1.25rem 0.4rem;
  box-shadow: inset 0 0 0.375rem 0 rgba(255, 255, 255, 0.5);
  border: 0.063rem solid var(--primary-pri_100);
  background-color: var(--etc-popup_tit);
  color: var(--white-w_100);
}

.check_dl {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 1rem 0;
}
.check_dl:last-child {
  margin-bottom: 0;
}
.check_dl.current {
  margin: 0.5rem 0;
}
.check_dl.current:last-child {
  margin-bottom: 0;
}
.check_dl dt {
  font-size: 0.8125rem;
  font-weight: 300;
  display: flex;
  justify-content: space-between;
  width: 4rem;
  padding: 0 1rem 0 0;
  color: var(-white-w-60);
}
.check_dl dd {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 1;
  -moz-column-gap: 0.25rem;
       column-gap: 0.25rem;
}
.check_dl dd .wrput {
  width: 100%;
}
.check_dl dd .ch_radio:last-child {
  padding: 0;
}

.ch_radio {
  display: flex;
  align-items: center;
  padding: 0 0.75rem 0 0;
  cursor: pointer;
}
.ch_radio.on .radio {
  background-color: #fff;
  border: 0.25rem solid var(--primary-pri_100);
}
.ch_radio.on .word {
  color: var(--primary-pri_100);
}
.ch_radio .radio {
  display: inline-block;
  width: 0.9375rem;
  height: 0.9375rem;
  background-color: var(--radio-default);
  border-radius: 100%;
  margin: 0 0.5rem 0 0;
}
.ch_radio .radio.mini {
  width: 0.625rem;
  height: 0.625rem;
  border: 0.125rem solid var(--primary-pri_100);
  margin: 0 0.375rem 0 0;
}
.ch_radio .word {
  font-size: 0.8125rem;
  font-weight: 300;
  color: var(--white-w_87-sec);
}

.user_info {
  width: 100%;
}

.pr_sign {
  font-size: 0.875rem;
  font-weight: 400;
  min-width: 7rem;
  height: 1.75rem;
  padding: 0.45rem 0.5rem;
  background: rgba(255, 255, 255, 0.12);
  border-radius: 0.125rem;
  cursor: pointer;
}

.profile_cont {
  display: flex;
  justify-content: center;
  width: 100%;
  padding: 1.25rem 0 3.25rem;
  position: relative;
}
.profile_cont .pr_sign, .profile_cont .btn_secondary {
  position: absolute;
  right: 0;
  top: 0;
}

.circle_g32 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  background: #4A4E66;
  border: 0.125rem solid var(--etc-bg);
  border-radius: 100%;
  overflow: hidden;
}
.circle_g32:hover, .circle_g32:focus, .circle_g32.hover {
  background: #636771;
}
.circle_g32 img {
  width: 1rem;
}

.profile_photo {
  position: relative;
  width: 5rem;
  height: 5rem;
}
.profile_photo .circle_g32 {
  position: absolute;
  cursor: pointer;
  right: -0.25rem;
  bottom: -0.25rem;
  z-index: 30;
}

.photo_circle {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: var(--more-visible-wh_60-to-12);
  border-radius: 100%;
  overflow: hidden;
}
.photo_circle img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}
.photo_circle img.img_prof {
  width: 2.5rem;
}

.user_form {
  width: 100%;
}

.check_dl.user {
  color: var(--white-w_60);
  margin: 0.5rem 0;
  min-height: 1.75rem;
}
.check_dl.user dt {
  width: 7rem;
}
.check_dl.user .ch_radio {
  padding: 0 1.875rem 0 0;
}

.calendar_wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 0.125rem;
  width: 13.75rem;
  height: 1.75rem;
  padding: 0 0.5rem;
  background: rgba(255, 255, 255, 0.12);
  cursor: pointer;
}
.calendar_wrap.blue {
  background-color: rgba(0, 104, 230, 0.6);
  box-shadow: 0 0 0.75rem 0 inset #0068e6;
  border-radius: 0.1875rem;
  height: 100%;
  border-radius: 0;
}
.calendar_wrap.blue:hover {
  background: #0155BD;
  box-shadow: inset 0 0 0.75rem rgba(39, 212, 255, 0.5);
}
.calendar_wrap.transline {
  background: transparent;
  background: rgb(10, 11, 20);
  border: 0.063rem solid rgba(255, 255, 255, 0.38);
}

.icon_calen24 {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  background: url(../images/calendar_fff_24.svg) no-repeat center center;
  background-size: 100% 100%;
}

.calen_date {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: calc(100% - 2rem);
  padding: 0.1rem 0.25rem 0;
  -moz-column-gap: 0.875rem;
       column-gap: 0.875rem;
}
.calen_date span {
  font-size: 0.8125rem;
  font-weight: 300;
  color: rgba(255, 255, 255, 0.87);
  letter-spacing: 0.031rem;
}

.bott_info {
  border-radius: 0.125rem;
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  width: 13.125rem;
  height: 11rem;
  overflow: hidden;
  padding: 0.5rem;
  border: 0.063rem solid var(--line-pri_40-to-wh_100);
  background-color: var(--bg_02_60);
}
.bott_info.hover {
  border: 0.063rem solid var(--primary-pri_40);
}
.bott_info.medium {
  width: 10.625rem;
  height: 8.75rem;
  background-color: var(--more-bright-wh_6-to-60);
  border: 0.063rem solid #0068E6;
}
.bott_info.small {
  width: 8.625rem;
  height: 7.5rem;
  background-color: var(--more-bright-wh_6-to-60);
  border: none;
}
.bott_info.small .smart_top .date {
  font-size: 0.6875rem;
  font-weight: 400;
}
.bott_info.small .smart_cont {
  padding: 0;
}
.bott_info.small .smart_cont .sm_txt {
  font-size: 0.75rem;
  font-weight: 400;
  margin: 0;
}
.bott_info.small .smart_cont .sm_result {
  font-size: 1.25rem;
}
.bott_info.small .smart_cont .sm_result .mini {
  font-size: 0.8125rem;
  font-weight: 400;
}
.bott_info.chart {
  height: 10.5rem;
}
.bott_info.donot {
  background-image: url("../../assets/images/donot_line_labelbox.svg");
  background-repeat: no-repeat;
  background-position: right top;
  background-size: cover;
}

.smart_chart_wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  height: calc(100% - 1.125rem);
}
.smart_chart_wrap .smart_cont {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
}
.smart_chart_wrap .chart {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.smart_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.smart_top .date {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--white-w_60);
  text-align: right;
}

.smart_cont {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: calc(100% - 1.125rem);
  padding: 7% 0 0;
}
.smart_cont.bott {
  padding: 4% 0 0;
}
.smart_cont.bott .sm_result {
  margin: 0 0 0.25rem;
  font-size: 1.7rem;
}
.smart_cont.bott .sm_txt {
  font-size: 0.8125rem;
  font-weight: 400;
  margin: 0 0 0.25rem;
}
.smart_cont.bott .percent_txt {
  font-size: 0.8125rem;
  font-weight: 400;
}
.smart_cont .sm_result {
  margin: 0 0 0.188rem;
}

.sm_result {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: 700;
  flex-wrap: wrap;
  width: 100%;
  letter-spacing: 0;
}
.sm_result .mini {
  font-size: 0.875rem;
  font-weight: 400;
  margin: 0.5rem 0 0 0.25rem;
}

.sm_txt {
  font-size: 0.75rem;
  font-weight: 400;
  text-align: center;
  word-break: keep-all;
}
.sm_txt.mini {
  font-size: 0.7rem;
}

.percent_txt {
  display: flex;
  align-items: center;
  font-size: 0.75rem;
  line-height: 1;
  margin: 0;
}
.percent_txt.equal {
  color: #FFBF00;
}
.percent_txt.up {
  color: #E62222;
}
.percent_txt.down {
  color: var(--etc-b_text);
}
.percent_txt.down2 {
  color: var(--etc-b_text);
}
.percent_txt .mini {
  font-size: 0.8125rem;
  font-weight: 400;
  margin: 0 0.25rem 0 0;
}
.percent_txt .ic {
  margin: 0 0 0 0.125rem;
}

.ic_equal {
  display: inline-block;
  width: 0.75rem;
  height: 0.875rem;
  background: url("../images/ic_equal.svg") no-repeat center center;
  background-size: auto 100%;
}

.ic_up {
  display: inline-block;
  width: 0.75rem;
  height: 0.875rem;
  background: url("../images/ic_up.svg") no-repeat center center;
  background-size: auto 100%;
}

.ic_down {
  display: inline-block;
  width: 0.75rem;
  height: 0.875rem;
  background: url("../images/arrow_bold_down_fff_12.svg") no-repeat center center;
  background-size: auto 100%;
}

.vert_2line {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  margin: 0 0 0.75rem;
}

.speed_box {
  width: 100%;
  height: 3rem;
  padding: 0.25rem;
  overflow: hidden;
  background: var(--more-visible-wh_6-to-60);
  text-align: center;
}
.speed_box.table {
  background: transparent;
  border: 0.063rem solid var(--white-w_20);
  padding: 0.3rem 0.6rem;
}
.speed_box.bord {
  padding: 0;
}
.speed_box.bord .table_dl {
  height: 50%;
}
.speed_box.bord .table_dl dt {
  height: 100%;
  justify-content: center;
}
.speed_box .img_chart {
  height: 100%;
}
.speed_box .speed_result {
  padding: 0;
}

.table_dl {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.75rem;
  font-weight: 300;
  color: var(--white-w_87-sec);
  width: 100%;
}
.table_dl dt {
  display: flex;
  align-items: center;
  width: 2.2rem;
  height: 1.15rem;
  border-right: 0.063rem solid var(--white-w_20);
}
.table_dl dd {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex: 1;
}

.speed_result {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--primary-pri_100);
}
.speed_result .unit {
  font-size: 0.75rem;
  font-weight: 400;
}

.exp_weather {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 6rem;
  margin: 0 0 0.25rem;
  overflow: hidden;
  padding: 0.25rem;
  background-color: var(--more-visible-wh_6-to-60);
}

.weather_cont {
  width: 100%;
  height: 100%;
}

.weather_sign {
  display: flex;
  align-items: center;
  justify-content: center;
}

.weath_record {
  font-size: 0.8125rem;
  font-weight: 400;
  display: block;
  letter-spacing: 0.063rem;
}

.weath_dl {
  display: flex;
  justify-content: space-between;
  width: 100%;
  padding: 0.2rem 0;
}
.weath_dl dt {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--white-w_87);
  padding: 0 0.625rem 0 0;
}
.weath_dl dd {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--white-w_87-sec);
}

.weather_box {
  width: 100%;
  height: 100%;
  padding: 0.5rem;
  overflow: hidden;
  border: 0.063rem solid var(--white-w_20);
}

.weath_mark56 {
  display: inline-block;
  width: 2.5rem;
  height: 2.5rem;
}
.weath_mark56.sun {
  background: url("../images/sometimes_snow_or_rain_56.svg") no-repeat center center;
  background-size: contain;
}

.dust_cont {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  min-height: 5.25rem;
  text-align: center;
  padding: 0.5rem;
  background-color: var(--more-visible-wh_6-to-60);
  overflow: hidden;
}
.dust_cont.hauto {
  min-height: auto;
}
.dust_cont .unit {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--white-w_60);
}

.fore_box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 0.5rem;
  margin: 0 0 0.25rem;
  background: var(--more-visible-wh_6-to-bk);
  border-radius: 0.125rem;
}

.fore_dl {
  text-align: center;
  padding: 0;
  letter-spacing: 0.038rem;
  width: 40%;
}
.fore_dl dt {
  font-size: 0.8125rem;
  font-weight: 500;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #ffe043;
  width: 100%;
  padding-top: 0.2rem;
}
.fore_dl dd {
  font-size: 0.8125rem;
  font-weight: 400;
  color: #ffe043;
}

.fore_cent {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  padding: 0 0.25rem;
  width: 2.25rem;
}
.fore_cent .img_arrow {
  width: 2.25rem;
  margin-bottom: 0.25rem;
}
.fore_cent .status {
  font-size: 0.8125rem;
  font-weight: 500;
  margin: 0.25rem 0 0;
}
.fore_cent .status.danger {
  color: #FF1F55;
}

.bg_traffic {
  width: 100%;
  background-color: var(--more-visible-wh_6-to-60);
}

.line_bus {
  width: 100%;
  height: 3.25rem;
  display: flex;
  position: relative;
  padding-left: 2.5rem;
}

.bb_line {
  position: absolute;
  left: 2.5rem;
  top: 0;
  width: 0.125rem;
  height: 100%;
  background-color: #00bd78;
  z-index: 3;
}
.bb_line.org {
  background-color: #fc8a18;
}
.bb_line.red {
  background-color: #e62222;
}

.bb_road {
  position: relative;
  width: 100%;
  height: 100%;
}

.ic_artff {
  width: 1rem;
  height: 1rem;
  background: url("../images/arr_traff_16.svg") no-repeat center center;
  background-size: contain;
  position: absolute;
  top: 50%;
  top: 62%;
  left: 2.5rem;
  margin-top: -1rem;
  margin-left: -0.5rem;
  z-index: 5;
}

.list_bus {
  width: 100%;
  padding: 0.4rem 0 0.25rem 1.25rem;
  display: flex;
  align-items: center;
  border-bottom: 0.063rem solid var(--white-w_20);
  overflow: hidden;
}

.bus_dl {
  width: 100%;
}

.bus_dl dd {
  width: 100%;
}

.bus_dl dd p {
  font-size: 0.8125rem;
  font-weight: 400;
  overflow: hidden;
  white-space: nowrap;
  padding: 0.125rem 0 0 0;
}
.bus_dl dd p.hints {
  font-size: 0.75rem;
  font-weight: 300;
  color: var(--white-w_60);
  margin: 0.25rem 0 0;
}

.emer_vms {
  width: 100%;
}

.vms_top {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 1.5rem;
  overflow: hidden;
  padding: 0 0.5rem;
  background: var(--more-visible-wh_6-to-bk);
}
.vms_top .arr_right {
  width: 0.75rem;
}
.vms_top.top {
  background: var(--more-visible-wh_6-to-60);
}

.vms_word {
  font-size: 0.875rem;
  font-weight: 700;
  margin: 0 0.625rem;
  color: var(--white-w_87-sec);
}
.vms_word.danger {
  margin: 0;
  color: #ff1f55;
}

.vms_monit {
  width: 100%;
  height: 11.75rem;
  background-color: #000;
  padding: 0.75rem;
  overflow: hidden;
}
.vms_monit img {
  width: 15.5rem;
  height: 10.188rem;
}

.park_dl {
  width: 100%;
  display: flex;
  padding: 0.375rem 0;
  letter-spacing: 0.063rem;
}
.park_dl dt {
  width: 4.5rem;
  padding: 0 0.625rem 0 0;
  font-size: 0.8125rem;
  font-weight: 400;
}
.park_dl dd {
  flex: 1;
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--white-w_87-sec);
}

.emer_detail {
  width: 100%;
  padding: 1rem;
  border-radius: 0.125rem;
  background-color: var(--more-visible-wh_6-to-60);
}

.label_txt {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 0.8125rem;
  font-weight: 400;
  flex: 1;
  padding: 0.125rem 0 0 0.5rem;
  line-height: 1;
}

.sp_graph {
  display: inline-block;
  min-width: 0.375rem;
  height: 0.375rem;
  background-color: #0068E6;
}
.sp_graph.sky {
  background-color: #27D4FF;
}

.drop_content {
  width: 100%;
  padding: 1.25rem;
  background: var(--bg_01_80);
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
}

.uni_table01 {
  width: 100%;
}
.uni_table01.sm thead th {
  height: 2rem;
  padding: 0.1rem 0.5rem 0;
}
.uni_table01.sm tbody td {
  height: 2rem;
  padding: 0.1rem 0.5rem 0;
}
.uni_table01 thead th {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--white-w_87);
  line-height: 1.2;
  background-color: var(--more-bright-wh_16-to-6);
  border-right: 0.063rem solid var(--white-w_12);
  text-align: center;
  vertical-align: middle;
  height: 2.25rem;
  padding: 0.1rem 0.75rem 0;
}
.uni_table01 thead th:last-child {
  border-right: none;
}
.uni_table01 tbody tr {
  background-color: var(--more-visible-wh_6-to-100);
}
.uni_table01 tbody tr:hover td {
  background: rgba(39, 212, 255, 0.2);
}
.uni_table01 tbody tr td {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--white-w_87);
  line-height: 1.2;
  background: var(--more-bright-wh-6-to-100);
  border-right: 0.0625rem solid var(--white-w_12);
  border-top: 0.125rem solid var(--bg_01_80);
  text-align: center;
  vertical-align: middle;
  height: 2.25rem;
  padding: 0.1rem 0.75rem 0;
}
.uni_table01 tbody tr td:first-child {
  width: 2.75rem;
}
.uni_table01 tbody tr td:last-child {
  border-right: none;
}

/*header*/
header {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 48px;
  z-index: 200;
  background-color: var(--bg_01_80);
}
header.two_line {
  height: 5rem;
  background-color: var(--bg_01_80);
  border-bottom: 0.063rem solid var(--line-wh_20-to-100);
}

.header_in {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  width: 100%;
  height: 100%;
  padding: 0 1.25rem;
}
.header_in::before {
  content: "";
  z-index: -1;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  -webkit-backdrop-filter: blur(1.875rem);
          backdrop-filter: blur(1.875rem);
}
.header_in .gnb {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.header_in.navigation {
  background: var(--bg_01_80);
}

.header_left {
  display: flex;
  align-items: center;
  -moz-column-gap: 16px;
       column-gap: 16px;
  padding: 0 16px 0 0;
}

.header_logo {
  display: flex;
  align-items: center;
}
.header_logo a {
  display: flex;
  align-items: center;
}

.logo_hd_kisa {
  width: 96px;
  margin-bottom: 8px;
}

.sp_logo_uniplus {
  display: block;
  width: 9.125rem;
  height: 1.25rem;
  background: url("../images/logo_uniplus.svg") no-repeat left center;
  background-size: cover;
}

.gnb {
  height: 100%;
}
.gnb ul {
  display: flex;
  align-items: center;
  height: 100%;
}
.gnb ul li a {
  font-size: 0.875rem;
  font-weight: 500;
  display: block;
  color: var(--more-visible-wh_60-to-100);
  letter-spacing: -0.031rem;
  word-break: keep-all;
  cursor: pointer;
}
.gnb ul li a.on, .gnb ul li a:hover, .gnb ul li a:focus {
  color: var(--primary-pri_100);
}
.gnb.two_line {
  height: 100%;
}
.gnb.two_line ul {
  display: flex;
  align-items: center;
  height: 50%;
}
.gnb.two_line ul li a {
  font-size: 0.875rem;
  font-weight: 400;
  display: block;
  color: var(--more-visible-wh_60-to-100);
  letter-spacing: -0.031rem;
  word-break: keep-all;
  cursor: pointer;
}
.gnb.two_line ul li a.on, .gnb.two_line ul li a:hover, .gnb.two_line ul li a:focus {
  color: var(--primary-pri_100);
}

.weath_mark32 {
  display: inline-block;
  width: 2rem;
  height: 2rem;
}
.weath_mark32.very_bad {
  background: url(../images/air_quality_very_bad_32.svg) no-repeat center center;
  background-size: cover;
}
.weath_mark32.sun {
  background: url(../images/wt_sun32.svg) no-repeat center center;
  background-size: cover;
}
.weath_mark32.some_snow_rain {
  background: url(../images/sometimes_snow_or_rain_32.svg) no-repeat center center;
  background-size: cover;
}

.time_mark20 {
  display: inline-block;
  width: 1.25rem;
  height: 1.25rem;
}
.time_mark20.clock {
  background: url(../images/icon_clock_20.svg) no-repeat center center;
  background-size: cover;
}
.time_mark20.clock_direct {
  background: url(../images/icon_clock_direction_20.svg) no-repeat center center;
  background-size: cover;
}

.header_right {
  display: flex;
  align-items: center;
  -moz-column-gap: 1.75rem;
       column-gap: 1.75rem;
  padding: 0 0 0 1rem;
}

.hd_status {
  display: flex;
  align-items: center;
}
.hd_status .hd_text {
  margin: 0 0 0 0.4rem;
}

.hd_text {
  display: flex;
  align-items: center;
  -moz-column-gap: 0.25rem;
       column-gap: 0.25rem;
}
.hd_text span {
  font-size: 0.875rem;
  font-weight: 400;
  color: var(--white-w_87-sec);
}

.hd_profile {
  position: relative;
  width: 1.875rem;
  height: 1.25rem;
}

.profile_box {
  display: flex;
  align-items: center;
  justify-content: center;
  -moz-column-gap: 0.125rem;
       column-gap: 0.125rem;
  cursor: pointer;
}
.profile_box .profile20 {
  opacity: 0.6;
}
.profile_box .comma_under8 {
  opacity: 0.6;
}
.profile_box.on .profile20 {
  opacity: 1;
}
.profile_box.on .comma_under8 {
  opacity: 1;
  transform: rotate(180deg);
}

.profile20 {
  display: inline-block;
  width: 1.25rem;
  height: 1.25rem;
  background: url(../images/member_fff_20.svg) no-repeat center center;
  background-size: cover;
}

.comma_under8 {
  display: inline-block;
  width: 0.75rem;
  height: 0.75rem;
  background: url(../images/arrow_down_fill_fff_12.svg) no-repeat center center;
  background-size: cover;
}

.board_line {
  position: relative;
}
.board_line .btn_arrow_l {
  position: absolute;
  right: -1.7rem;
  top: 0;
  box-shadow: 1rem 0 1.5rem 0 rgba(4, 9, 26, 0.16);
}
.board_line .btn_arrow_l.left {
  right: auto;
  left: -1.7rem;
}

.indi_withtab {
  width: 100%;
  position: relative;
  padding: 2.375rem 0 0;
}
.indi_withtab .indi_tabs {
  position: absolute;
  left: 0;
  top: 0;
}

.indi_tabs {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.indi_tabs button {
  border-radius: 0;
}
.indi_tabs button:first-child {
  border-radius: 0.125rem 0 0 0;
}
.indi_tabs.top {
  border-radius: 0.125rem;
  background-color: var(--bg_01_80);
  height: 2.5rem;
  padding: 0 0.5rem;
  border-top: 0.063rem solid var(--box1_border);
  border-left: 0.063rem solid var(--box1_border);
  border: 0.063rem solid var(--line-pri_40-to-wh_100);
}

.busrt_dl {
  display: flex;
  align-items: center;
}
.busrt_dl dt {
  padding: 0 0.625rem 0 0;
}
.busrt_dl dd {
  display: flex;
  align-items: center;
}

.busrt_wrap {
  display: flex;
  align-items: center;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  height: 1.25rem;
  padding: 0 0.125rem;
  background: transparent;
  border: 0.063rem solid var(--white-w_20);
  border-radius: 0.125rem;
}
.busrt_wrap span {
  font-size: 0.6875rem;
  font-weight: 400;
}
.busrt_wrap span.green {
  color: #008C69;
}
.busrt_wrap span.red {
  color: #FF1F55;
}

.express_paging {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 0 0;
}
.express_paging .pg_ball, .express_paging .pg_prev, .express_paging .pg_next {
  margin: 0 0.25rem;
}

.pg_ball {
  display: inline-block;
  width: 0.375rem;
  height: 0.375rem;
  background: var(--primary-pri_40);
  border-radius: 100%;
  cursor: pointer;
}
.pg_ball.on {
  background: var(--primary-pri_100);
}

.pg_prev {
  display: inline-block;
  width: 0.75rem;
  height: 0.75rem;
  cursor: pointer;
}

.pg_next {
  display: inline-block;
  width: 0.75rem;
  height: 0.75rem;
  cursor: pointer;
}

.marker {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.marker img {
  width: 100%;
}
.marker.mk48 {
  width: 3rem;
  height: 3rem;
}
.marker.mk56 {
  width: 3.5rem;
  height: 3.5rem;
}

.toggle {
  cursor: pointer;
}

.heat_box {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  background-color: #fff;
}

.check_text {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  cursor: pointer;
}
.check_text .text {
  font-size: 0.8125rem;
  font-weight: 400;
  margin: 0.25rem 0 0 0.375rem;
}

.select_wrap .selectbox {
  width: 100% !important;
}

.start_dl {
  width: 100%;
  padding: 0;
  text-align: center;
  line-height: 1.3;
}
.start_dl dt {
  display: flex;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--primary-pri_100);
}
.start_dl dd {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--primary-pri_100);
}

.record {
  font-size: 0.6875rem;
  font-weight: 300;
  color: var(--white-w_60);
}

.park_space {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 5.625rem;
  height: 2.75rem;
}

.park_sign {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4.75rem;
  height: 1.875rem;
  overflow: hidden;
  padding: 0 0.125rem 0.3125rem 1.25rem;
  text-align: right;
  cursor: pointer;
}
.park_sign .park_txt {
  font-size: 0.75rem;
  font-weight: 400;
  display: block;
  overflow: hidden;
}
.park_sign.danger {
  background: url("../images/park_danger.svg") no-repeat center center;
  background-size: contain;
}
.park_sign.danger.on {
  width: 5.5625rem;
  height: 2.875rem;
  background: url("../images/park_danger_on.svg") no-repeat center center;
  background-size: contain;
}

.bel_line {
  position: relative;
  width: 2.5rem;
  height: 0.0625rem;
  background: var(--primary-pri_100);
}
.bel_line .bel_circle {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.bel_line .bel_circle.left {
  left: 0;
}
.bel_line .bel_circle.right {
  right: 0;
}

.bel_circle {
  width: 0.375rem;
  height: 0.375rem;
  display: inline-block;
  background: #fff;
  border: 0.063rem solid var(--primary-pri_100);
  border-radius: 100%;
}

.chart_label {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
}
.chart_label.right_top {
  left: auto;
  transform: none;
  right: 0;
  top: 0rem;
  bottom: auto;
}
.chart_label.left_bottom {
  left: 0;
  transform: none;
  right: auto;
  top: auto;
  bottom: 0rem;
}

.xydual_wrap {
  display: flex;
  align-items: flex-start;
  width: 100%;
}
.xydual_wrap #XYChartDual {
  transform: translateY(-2rem);
}

.square {
  display: inline-block;
  width: 0.625rem;
  height: 0.625rem;
  background-color: #0068E6;
}
.square.blue {
  background-color: #0E44E6;
}
.square.blue_deep {
  background-color: #0A2ACC;
}
.square.sky {
  background-color: #27D4FF;
}
.square.sky_blue {
  background-color: #16A3E9;
}
.square.green_light {
  background-color: #9DFFBE;
}
.square.green {
  background-color: #16D9AB;
}
.square.purple {
  background-color: #937EFF;
}
.square.purple_light {
  background-color: #B5A6FF;
}
.square.violet {
  background-color: #6548F5;
}
.square.etc {
  background-color: rgba(255, 255, 255, 0.3);
}
.square.white {
  background-color: #fff;
}

.label {
  color: var(--alpha-bk-to-whbk-87);
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  padding: 8px 12px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  padding: 8px 12px;
  overflow: hidden;
  background-color: var(--alpha-bk-to-whbk-10);
  word-break: keep-all;
}

.login_txt {
  color: var(--alpha-bk-to-whbk-100);
  font-size: 32px;
  font-weight: 700;
}

.num_txt {
  color: var(--alpha-bk-to-whbk-60);
  font-size: 16px;
  font-weight: 700;
  margin-top: 20px;
}

.preview_box {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.file_realname {
  padding: 0 0.5rem;
  overflow: hidden;
  line-height: 1rem;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--white-w_100-sec);
}

.relative {
  position: relative;
}

.upload_box {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column !important;
  background: var(--white-w_6);
}
.upload_box.line {
  display: flex;
  align-items: center;
  border-radius: 0.125rem;
  flex-direction: unset !important;
  border: 0.063rem solid var(--white-w_20);
  background-color: transparent;
}

.image_upload {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  position: absolute;
  z-index: 9;
  top: 0.5rem;
  right: 0.5rem;
  cursor: pointer;
}

.dim_bg {
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%);
}

.image_modify {
  border-radius: 0.125rem;
  overflow: hidden;
}
.image_modify .image_upload {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
}

.image_center {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}

.frame_border {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  position: relative;
  border: 0.063rem solid rgba(39, 212, 255, 0.4);
  box-shadow: inset 0 0.25rem 0.75rem rgba(39, 212, 255, 0.4);
  background: rgba(10, 11, 20, 0.4);
}

.spin_animation {
  animation: spinAni 1.2s infinite linear;
}

@keyframes spinAni {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.progress_bar {
  background: var(--white-w_20);
}
.progress_bar .progress_percetage {
  width: 30%;
  height: 100%;
  background-color: var(--primary-pri_100);
}

.text_shadow50 {
  text-shadow: 0 0 0.75rem var(--primary-pri_100);
}

.loading_text_animation {
  font-size: 0.875rem;
  font-weight: 700;
  opacity: 0;
  overflow: hidden;
  animation: loadingText 1.5s infinite linear;
  color: var(--primary-pri_100);
}

@keyframes loadingText {
  0% {
    opacity: 0;
  }
  30%, 100% {
    opacity: 100;
  }
}
.pd-2-12 {
  padding: 0.125rem 0.75rem;
}

.pd-20-24 {
  padding: 1.25rem 1.5rem;
}

.popover_box {
  position: relative;
}
.popover_box .placement {
  box-shadow: 0.25rem 0.25rem 1rem 0 rgba(4, 9, 26, 0.16);
  display: none;
  position: absolute;
}
.popover_box .placement.show {
  display: block;
}
.popover_box .placement.top {
  bottom: 2.625rem;
}
.popover_box .placement.left {
  left: 0;
}
.popover_box .placement.right {
  right: 0;
}
.popover_box .placement.bottom {
  top: 2.625rem;
}
.popover_box .placement.left_bottom {
  left: 2.75rem;
  bottom: 0;
}
.popover_box .placement.right_bottom {
  right: 2.75rem;
  bottom: 0;
}
.popover_box .placement.left_top {
  left: 2.75rem;
  top: 0;
}
.popover_box .placement.right_top {
  right: 2.75rem;
  top: 0;
}
.popover_box .placement.top_right {
  right: 2.75rem;
}
.popover_box .placement.top_left {
  left: 2.75rem;
  top: 0;
}

.popover_title,
.popover_contents {
  box-shadow: 0.25rem 0.25rem 1rem 0 rgba(4, 9, 26, 0.16);
  border-style: solid;
  border-color: var(--line-wh_30-to-60);
  overflow: hidden;
}

.fc_popover {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--white-w_100-sec);
}

.fs_info {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--white-w_100-sec);
  text-align: center;
}

.fs_unit {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--white-w_60);
  text-align: center;
}

.popover_title {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 2.625rem;
  padding: 0 1rem 0 1.25rem;
  border-width: 0.063rem 0.063rem 0 0.063rem;
  border-radius: 0.125rem 0.125rem 0 0;
  background: rgba(0, 0, 13, 0.4);
  font-weight: 500;
  color: var(--white-w_100-sec);
}
.popover_title .popover_close {
  transform: translate(0, -0.063rem);
}

.popup_title_bg {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 2.625rem;
  padding: 0 1rem 0 1.25rem;
  border-width: 0.063rem 0.063rem 0 0.063rem;
  border-radius: 0.125rem 0.125rem 0 0;
  background: rgba(0, 0, 13, 0.4);
  font-weight: 500;
  color: var(--white-w_100);
}
.popup_title_bg .popup_close {
  transform: translate(0, -0.063rem);
}

.pop_span {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
}

.popover_title {
  background-color: var(--black-bk_100);
}

.popover_contents {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  padding: 1.25rem;
  background: var(--bg_02_60);
  border-width: 0 0.063rem 0.063rem 0.063rem;
  border-radius: 0 0 0.125rem 0.125rem;
}

.data_contents {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  padding: 1.25rem;
  background: var(--bg_02_60);
  border-width: 0 0.063rem 0.063rem 0.063rem;
  border-radius: 0 0 0.125rem 0.125rem;
  border-bottom: 0.063rem solid var(--line-wh_30-to-60);
  border-right: 0.063rem solid var(--line-wh_30-to-60);
  border-left: 0.063rem solid var(--line-wh_30-to-60);
}

.status {
  border-radius: 0.125rem;
  width: 1.625rem;
  height: 0.75rem;
}

.popup_title_bg {
  border-radius: 0;
  background: var(--etc-popup_tit);
  border: 0.063rem solid var(--primary-pri_100);
  box-shadow: inset 0 0 0.75rem rgba(255, 255, 255, 0.5);
}

.popup_title {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--white-w_100);
}
.popup_title.fs_16_bold {
  font-size: 1rem;
  font-weight: 700;
}

.popup_contents {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  border-radius: 0;
  min-height: 9.625rem;
  padding: 0 0;
  background: var(--bg_01_80);
  border-width: 0 0.063rem 0.063rem 0.063rem;
  border-style: solid;
  border-color: var(--line-pri_40-to-wh_40);
}

.accordion_block.default .accordion_title {
  background: var(--more-bright-wh_12-to-6);
}
.accordion_block.default .accordion_title:hover:not(.disabled):not(.accordion_level2), .accordion_block.default .hover.accordion_title,
.accordion_block.default .accordion_title:focus:not(.disabled):not(.accordion_level2) {
  background: var(--more-visible-wh_20-to-12);
}
.accordion_block.default .accord_title_in {
  background: var(--bg_02_60);
}
.accordion_block.default2 .accordion_title.default {
  background: var(--more-bright-wh_12-to-6);
}
.accordion_block.default2 .accordion_title.default:hover:not(.disabled):not(.accordion_level2), .accordion_block.default2 .hover.accordion_title.default,
.accordion_block.default2 .accordion_title.default:focus:not(.disabled):not(.accordion_level2) {
  background: var(--more-visible-wh_20-to-12);
}
.accordion_block.default2 .accordion_title {
  background: rgba(255, 255, 255, 0.12);
}
.accordion_block.default2 .accord_title_in {
  background: var(--bg_02_60);
}
.accordion_block.point {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
}
.accordion_block.point .accordion_title,
.accordion_block.point .accordion_title:hover:not(.point .disabled) {
  background: var(--primary-pri_20);
}
.accordion_block.point .accordion_title:hover:not(.accordion_level2):not(.disabled):not(.point .disabled), .accordion_block.point .hover.accordion_title,
.accordion_block.point .accordion_title:focus {
  background: var(--primary-pri_30);
}
.accordion_block.point .accordion_contents {
  background: rgba(255, 255, 255, 0.06);
}
.accordion_block.point.disabled {
  cursor: default;
}
.accordion_block.point.disabled .accordion_title {
  color: var(--white-w_20);
}
.accordion_block.level .accordion_title {
  background: transparent;
}
.accordion_block.level .accordion_title:hover:not(.disabled), .accordion_block.level .hover.accordion_title,
.accordion_block.level .accordion_title:focus:not(.disabled) {
  background: transparent;
}
.accordion_block.level .accord_title_in {
  background: rgba(4, 9, 26, 0.6);
}
.accordion_block.disabled {
  cursor: default;
}
.accordion_block.disabled .accordion_title {
  background: var(--more-bright-wh_12-to-6);
  color: var(--white-w_20);
}
.accordion_block.disabled .accordion_title .toggle {
  opacity: 0.4;
}
.accordion_block.disabled .accordion_title .img_with {
  opacity: 0.2;
}
.accordion_block.disabled .accordion_toggle {
  cursor: default;
  opacity: 0.2;
}
.accordion_block.disabled_level2 {
  cursor: default;
}
.accordion_block.disabled_level2 .accordion_title {
  background: transparent;
  color: var(--white-w_20);
}
.accordion_block.disabled_level2 .accordion_title .toggle {
  opacity: 0.4;
}
.accordion_block.disabled_level2 .accordion_title .img_with {
  opacity: 0.2;
}
.accordion_block.disabled_level2 .accordion_toggle {
  cursor: default;
  opacity: 0.2;
}
.accordion_block.point.disabled {
  cursor: unset;
}
.accordion_block.point.disabled .accordion_title {
  background: var(--primary-pri_20);
  color: var(--white-w_20);
  cursor: default;
}
.accordion_block.select .accordion_title:focus,
.accordion_block.select .accordion_title:hover,
.accordion_block.select .hover.accordion_title {
  background: var(--primary-pri_30);
  background: var(--primary-pri_20);
}
.accordion_block.select .accordion_title:hover,
.accordion_block.select .hover.accordion_title {
  background: var(--primary-pri_30);
}
.accordion_block.select .accordion_title {
  background: var(--more-bright-wh_12-to-6);
}
.accordion_block.select .accordion_title.on {
  background: var(--primary-pri_30);
}
.accordion_block.select .accordion_title.on img, .accordion_block.select .accordion_title.hover img, .accordion_block.select .accordion_title:hover img, .accordion_block.select .accordion_title:focus img {
  filter: brightness(0) saturate(100%) invert(68%) sepia(15%) saturate(4375%) hue-rotate(161deg) brightness(105%) contrast(103%);
}
.accordion_block.select .accordion_contents {
  background: rgba(255, 255, 255, 0.06);
}
.accordion_block.select.disabled {
  cursor: unset;
}
.accordion_block.select.disabled .accordion_title:hover, .accordion_block.select.disabled .hover.accordion_title,
.accordion_block.select.disabled .accordion_title:focus {
  background: var(--more-bright-wh_12-to-6);
  color: rgba(255, 255, 255, 0.38);
  cursor: not-allowed;
}
.accordion_block.select.disabled .checkbox_type label:after {
  border: 0;
  background: rgba(255, 255, 255, 0.2);
}
.accordion_block.select.level2 .accordion_title:hover:not(.disabled), .accordion_block.select.level2 .hover.accordion_title,
.accordion_block.select.level2 .accordion_title:focus:not(.disabled) {
  background: transparent;
  cursor: pointer;
}
.accordion_block.select.level2 .accordion_title {
  background: transparent;
}
.accordion_block.select.level2 .accord_title_in {
  background: rgba(4, 9, 26, 0.6);
}
.accordion_block.select.level2 .accordion_contents {
  background: transparent;
}
.accordion_block.accord_select .accordion_title:focus,
.accordion_block.accord_select .accordion_title:active,
.accordion_block.accord_select .accordion_title:hover,
.accordion_block.accord_select .hover.accordion_title {
  background: var(--primary-pri_20);
  color: var(--primary-pri_100);
}
.accordion_block.accord_select .accordion_title:hover,
.accordion_block.accord_select .hover.accordion_title {
  background: var(--primary-pri_30);
  color: var(--primary-pri_100);
}
.accordion_block.accord_select .accordion_title {
  background: var(--more-bright-wh_12-to-6);
}
.accordion_block.accord_select .accordion_title.on, .accordion_block.accord_select .accordion_title:active, .accordion_block.accord_select .accordion_title:focus {
  background: var(--primary-pri_30);
}
.accordion_block.accord_select .accordion_title.selected {
  background: var(--primary-pri_20);
}
.accordion_block.accord_select .accordion_title.on img, .accordion_block.accord_select .accordion_title.hover img, .accordion_block.accord_select .accordion_title:hover img, .accordion_block.accord_select .accordion_title:focus img, .accordion_block.accord_select .accordion_title.selected img, .accordion_block.accord_select .accordion_title:active img {
  filter: brightness(0) saturate(100%) invert(68%) sepia(15%) saturate(4375%) hue-rotate(161deg) brightness(105%) contrast(103%);
}
.accordion_block.accord_select .accordion_contents {
  background: var(--more-bright-wh_12-to-6);
}
.accordion_block.accord_select .accordion_contents.user {
  background: var(--more-bright-wh_6-to-60);
}
.accordion_block.accord_select.disabled {
  cursor: unset;
}
.accordion_block.accord_select.disabled .accordion_title:hover, .accordion_block.accord_select.disabled .hover.accordion_title,
.accordion_block.accord_select.disabled .accordion_title:focus {
  background: var(--more-bright-wh_12-to-6);
  color: rgba(255, 255, 255, 0.38);
  cursor: not-allowed;
}
.accordion_block.accord_select.disabled .checkbox_type label:after {
  border: 0;
  background: rgba(255, 255, 255, 0.2);
}
.accordion_block.accord_select .checkbox_type input[type=checkbox]:checked + label + .accordion_title {
  background: var(--primary-pri_20);
  color: var(--primary-pri_100);
}
.accordion_block.accord_select .checkbox_type input[type=checkbox]:checked + label + .accordion_title .accordion_title {
  background: var(--primary-pri_20);
}
.accordion_block.accord .check_text .text {
  margin: 0;
}
.accordion_block.level {
  padding: 0 1.063rem 0 3.5rem;
}
.accordion_block.level .accordion_title:hover:not(.disabled), .accordion_block.level .hover.accordion_title,
.accordion_block.level .accordion_title:focus:not(.disabled) {
  background: transparent;
  cursor: pointer;
}
.accordion_block.level .accordion_title {
  background: transparent;
}
.accordion_block.level .accord_title_in {
  background: rgba(4, 9, 26, 0.6);
}
.accordion_block.levelwith .accordion_title:hover:not(.disabled), .accordion_block.levelwith .hover.accordion_title,
.accordion_block.levelwith .accordion_title:focus:not(.disabled) {
  background: transparent;
  cursor: pointer;
}
.accordion_block.levelwith .accordion_title {
  background: transparent;
}
.accordion_block.levelwith .accord_title_in {
  background: rgba(4, 9, 26, 0.6);
}
.accordion_block.accordion_level2 .accordion_title,
.accordion_block.accordion_level2 .accordion_contents {
  padding: 0 1.125rem 0 3.5rem;
}
.accordion_block.accordion_level2:hover {
  background: transparent;
}
.accordion_block.accordion_level2:hover .accordion_title,
.accordion_block.accordion_level2:hover .accordion_contents {
  padding: 0 1.125rem 0 3.5rem;
}

.accordion_title {
  display: flex;
  align-items: center;
  font-size: 0.875rem;
  font-weight: 500;
  position: relative;
  height: 2.25rem;
  padding: 0 1.125rem 0 1.25rem;
  color: var(--white-w_87-sec);
}
.accordion_title.disabled {
  background: var(--more-bright-wh_12-to-6);
  cursor: not-allowed;
  color: var(--white-w_20);
}

.accordion_contents {
  font-size: 0.8125rem;
  font-weight: 400;
  display: none;
  min-height: 2.25rem;
  padding: 0 1.125rem 0 1.25rem;
  line-height: 1rem;
  color: var(--white-w_87);
}
.accordion_contents.show {
  display: block;
}
.accordion_contents.inner {
  padding: 0 1.125rem 0 3.5rem;
}
.accordion_contents.line {
  border-bottom: 0.063rem solid var(--line-wh_30-to-60);
}

.accordion_paragraph {
  padding: 1.25rem 0;
  line-height: 1.125rem;
}

.tree_contents {
  display: none;
}
.tree_contents.show {
  display: block;
}

.accordion_toggle {
  cursor: pointer;
}
.accordion_toggle.disabled {
  cursor: default;
}

.accordion_up {
  display: none;
}

.accordion_title.on .accordion_up,
.accordion_toggle.on .accordion_up,
.tree_button.on .accordion_up {
  display: block;
}
.accordion_title.on .accordion_down,
.accordion_toggle.on .accordion_down,
.tree_button.on .accordion_down {
  display: none;
}

.accordion_title.on + .accordion_contents {
  display: block;
}

.accordion_title.disabled .accordion_up, .accordion_title.disabled .accordion_down {
  opacity: 0.4;
}

.tree_button {
  display: flex;
  align-items: center;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
}
.tree_button.check label {
  font-size: 0.8125rem;
  font-weight: 400;
}
.tree_button.no_check label {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--white-w_100-sec);
}

.card_block.default, .card_block.label {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  padding: 1.25rem;
  background: var(--bg_01_80) 0% 0% no-repeat padding-box;
  border: 0.063rem solid var(--line-pri_40-to-wh_40);
}
.card_block.label {
  border-radius: 0.125rem;
  display: flex;
  padding: 0.625rem;
}
.card_block.point {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  background: transparent url("../images/card_point_bg_320px.svg") 0% 0% no-repeat padding-box;
}

.card_head {
  display: flex;
  align-items: center;
  position: relative;
  height: 1.25rem;
  cursor: pointer;
}
.card_head.on:after {
  transform: rotate(180deg);
}
.card_head:after {
  position: absolute;
  content: "";
  top: 0;
  right: -0.375rem;
  width: 1.25rem;
  height: 1.25rem;
  background-image: url(../images/dropdown_uisky_20px.svg);
}

.inner_card_type1,
.inner_card_type2 {
  background: rgba(255, 255, 255, 0.06);
}
.inner_card_type1 .inner_head,
.inner_card_type2 .inner_head {
  height: 2.5rem;
  padding: 0.625rem 0.75rem;
  line-height: 1.25rem;
}

.inner_card_type1 {
  padding: 0 0.75rem 0.75rem;
}
.inner_card_type1 .inner_body {
  background: rgba(255, 255, 255, 0.06);
}

.inner_card_type2 .inner_head {
  background: rgba(255, 255, 255, 0.06);
}

.map_color__tag {
  width: 1rem;
  height: 1rem;
  font-size: 0.875rem;
  line-height: 1rem;
  border-radius: 0.125rem;
  border: 0.063rem solid #ffffff;
}

.checkbox_type label {
  position: relative;
  padding-left: 1.625rem;
  cursor: pointer;
  line-height: 1rem;
}
.checkbox_type label:after {
  position: absolute;
  content: "";
  border-radius: 0.125rem;
  top: 0.063rem;
  left: 0.125rem;
  width: 1rem;
  height: 1rem;
  border: 0.063rem solid var(--white-w_60);
  box-sizing: border-box;
  opacity: 0.6;
}
.checkbox_type input[type=checkbox]:checked + label {
  color: var(--primary-pri_100);
}
.checkbox_type input[type=checkbox]:checked + label:after {
  border: 0.063rem solid var(--primary-pri_100);
  background: url(../images/checkbox_checked.svg) 0.125rem center no-repeat;
  background-size: 0.625rem auto;
  opacity: 1;
}
.checkbox_type input[type=checkbox]:disabled + label, .checkbox_type .disabled {
  color: var(--white-w_20);
}
.checkbox_type input[type=checkbox]:disabled + label:after, .checkbox_type .disabled:after {
  border: none;
  background: var(--white-w_20);
}
.checkbox_type.part {
  align-self: center;
  color: var(--white-w_100-sec);
}
.checkbox_type.part input[type=checkbox]:checked + label {
  color: var(--white-w_100-sec);
}
.checkbox_type.part input[type=checkbox]:checked + label:after {
  background: url(../images/minus_sky_12.svg) center no-repeat;
  opacity: 1;
}
.checkbox_type.tree {
  align-self: center;
  color: var(--white-w_100-sec);
}
.checkbox_type.tree label:after {
  border: 0.063rem solid var(--white-w_100-sec);
  opacity: 0.8;
}
.checkbox_type.tree input[type=checkbox]:checked + label {
  color: var(--white-w_100-sec);
}
.checkbox_type.tree input[type=checkbox]:checked + label:after {
  border: 0.063rem solid var(--primary-pri_100);
  background: url(../images/checkbox_checked.svg) 0.125rem center no-repeat;
  background-size: 0.625rem auto;
  opacity: 1;
}
.checkbox_type.login label:after {
  border-radius: 50%;
  top: 0;
  left: 0;
  width: 1rem;
  height: 1rem;
  border: none;
  background: var(--white-w_40);
  opacity: 0.6;
}
.checkbox_type.login input[type=checkbox]:checked + label {
  color: inherit;
}
.checkbox_type.login input[type=checkbox]:checked + label:after {
  border: none;
  background: rgb(0, 104, 230) url(../images/checkbox_login_checked.svg) 0.125rem 0.188rem no-repeat;
  opacity: 1;
}
.checkbox_type.td label {
  padding-left: 1.25rem;
}

.radio_type label {
  position: relative;
  padding-left: 1.25rem;
  cursor: pointer;
}
.radio_type label:after {
  position: absolute;
  content: "";
  border-radius: 50%;
  top: 0.125rem;
  left: 0;
  width: 0.875rem;
  height: 0.875rem;
  box-sizing: border-box;
  background: var(--white-w_40);
}
.radio_type input[type=radio]:checked + label {
  color: var(--primary-pri_100);
}
.radio_type input[type=radio]:checked + label:after {
  border: 0.188rem solid var(--primary-pri_100);
  background: #ffffff;
}
.radio_type input[type=radio]:disabled + label, .radio_type .disabled {
  color: rgba(255, 255, 255, 0.38);
}
.radio_type input[type=radio]:disabled + label:after, .radio_type .disabled:after {
  background: rgba(255, 255, 255, 0.1);
}

.map_control_line {
  position: relative;
  overflow: hidden;
}
.map_control_line:after {
  background-color: var(--primary-pri_20);
}

.map_control_line_mini {
  position: relative;
  overflow: hidden;
}
.map_control_line_mini:after {
  background-color: var(--primary-pri_20);
}

.disabled.map_control_line:after {
  background-color: var(--control-disabled);
}
.disabled.map_control_line .map_control_rate:after,
.disabled.map_control_line .rate_block {
  background-color: var(--white-w_40);
}

.map_control_line:after,
.map_control_rate:after {
  position: absolute;
  content: "";
  border-radius: 0.125rem;
  z-index: 0;
  top: 0.313rem;
  width: 100%;
  height: 0.25rem;
}

.discrete_text {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--white-w_60);
}

.map_control_rate:after {
  z-index: 1;
}

.map_control_rate {
  position: relative;
  width: 0;
  min-width: 0.375rem;
}
.map_control_rate:after {
  background-color: var(--primary-pri_100);
}

.step_cursor {
  cursor: pointer;
}

.rate_block {
  border-radius: 0.375rem;
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  width: 0.375rem;
  height: 100%;
  cursor: pointer;
  background: var(--primary-pri_100);
}

.map_timeline.small div {
  height: 0.25rem;
}
.map_timeline > div {
  width: 0.063rem;
  height: 0.5rem;
  background: var(--white-w_40);
}

.disabled.map_control_line:after {
  background-color: var(--white-w_40);
  opacity: 0.1;
}
.disabled.map_control_line .map_control_rate:after,
.disabled.map_control_line .map_control_rate_mini:after,
.disabled.map_control_line .rate_block {
  background-color: var(--white-w_100-sec);
  opacity: 0.1;
}

.map_control_line:after,
.map_control_rate:after {
  position: absolute;
  content: "";
  border-radius: 0.125rem;
  z-index: 0;
  top: 0.313rem;
  width: 100%;
  height: 0.25rem;
}

.map_control_line_mini:after,
.map_control_rate_mini:after {
  position: absolute;
  content: "";
  border-radius: 0.125rem;
  z-index: 0;
  top: 0.188rem;
  width: 100%;
  height: 0.25rem;
}

.map_control_rate:after .map_control_rate_mini:after {
  z-index: 1;
}

.map_control_rate,
.map_control_rate_mini {
  position: relative;
  width: 0;
  min-width: 0.375rem;
}
.map_control_rate:after,
.map_control_rate_mini:after {
  background-color: var(--primary-pri_100);
}

.step_cursor {
  cursor: pointer;
}

.rate_block {
  border-radius: 0.375rem;
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  width: 0.375rem;
  height: 100%;
  cursor: pointer;
  background: var(--primary-pri_100);
}
.rate_block.small {
  width: 0.25rem;
}

.map_timeline.small div {
  height: 0.25rem;
}
.map_timeline > div {
  width: 0.063rem;
  height: 0.5rem;
  background: var(--white-w_40);
}
.map_timeline.xsmall div {
  height: 0.2rem;
}

.map_time_line {
  border-top: 0.063rem solid var(--line-wh_12-to-100);
  border-bottom: 0.063rem solid var(--line-wh_12-to-100);
  background: var(--bg_01_80);
}

.map_control_outline {
  display: flex;
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  border-radius: 0.125rem;
  align-items: stretch;
  border: 0.063rem solid var(--line-wh_12-to-100);
  background: var(--bg_01_80);
}
.map_control_outline .border_right {
  border-right: 0.063rem solid rgba(39, 212, 255, 0.12);
}
.map_control_outline .border_left {
  border-left: 0.063rem solid rgba(39, 212, 255, 0.12);
}
.map_control_outline .rate_block {
  width: 0.25rem;
}
.map_control_outline .map_control_line:after, .map_control_outline .map_control_rate:after {
  top: 0.25rem;
}
.map_control_outline .map_timeline.top {
  transform: translate(0, 0.188rem);
}
.map_control_outline .map_timeline.bottom {
  transform: translate(0, -0.188rem);
}

.member_box {
  position: relative;
}

.member_popover {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  border-radius: 0.125rem;
  display: none;
  position: absolute;
  right: 0;
  top: 1.86rem;
  z-index: 11 !important;
  background: var(--blur_02_60);
  border: 0.063rem solid var(--white-w_12);
  box-shadow: 0.75rem 0.75rem 1.5rem 0 rgba(4, 9, 26, 0.2);
}
.member_popover.on {
  display: block;
}

.tooltip_parents {
  position: relative;
}
.tooltip_parents:hover .tooltip_label:not(.on), .tooltip_parents:focus .tooltip_label:not(.on) {
  display: block;
  top: -1.563rem;
}

.tooltip_label {
  border-radius: 0.125rem;
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  font-size: 0.75rem !important;
  font-weight: 500 !important;
  display: none;
  position: absolute;
  min-height: 1.5rem;
  padding: 0 0.5rem;
  background: var(--etc-bg);
  border: 0.063rem solid var(--white-w_40);
  letter-spacing: 0.01em;
  line-height: 1.375rem;
  white-space: nowrap;
  color: var(--white-w_100-sec);
  box-shadow: 0 0.25rem 0.75rem 0 rgba(4, 9, 26, 0.2);
}
.tooltip_label.on {
  display: block;
}
.tooltip_label.default {
  border: 0.063rem solid var(--white-w_40-sec);
  opacity: 1;
  background: rgba(55, 61, 82, 0.6);
  box-shadow: 0 0.25rem 0.75rem 0 rgba(4, 9, 26, 0.2);
  color: var(--white-w_100);
}

.bubble {
  color: #FFF;
}
.bubble:before, .bubble:after {
  position: absolute;
  content: "";
  display: block;
  width: 0;
  left: 50%;
  border-style: solid;
}
.bubble:before {
  z-index: 0;
}
.bubble:after {
  z-index: 1;
}
.bubble.bb_black {
  background: rgb(5, 10, 25);
}
.bubble.bb_black:before {
  border-color: #636771 transparent;
}
.bubble.bb_black:after {
  border-color: rgb(5, 10, 25) transparent;
}
.bubble.bb_blue {
  background: #0068E6;
}
.bubble.bb_blue:before {
  border-color: #61a0ef transparent;
}
.bubble.bb_blue:after {
  border-color: #0068E6 transparent;
}
.bubble.bb_grey {
  background: #4F525E;
}
.bubble.bb_grey:before {
  border-color: rgba(255, 255, 255, 0.4) transparent;
}
.bubble.bb_grey:after {
  border-color: #4F525E transparent;
}
.bubble.bb_bottom:before {
  bottom: -0.469rem;
  margin-left: -0.313rem;
  border-width: 0.438rem 0.313rem 0;
}
.bubble.bb_bottom:after {
  bottom: -0.375rem;
  border-width: 0.375rem 0.25rem 0;
  margin-left: -0.25rem;
}
.bubble.bb_top:before {
  top: -0.469rem;
  margin-left: -0.313rem;
  border-width: 0 0.313rem 0.438rem;
}
.bubble.bb_top:after {
  top: -0.344rem;
  border-width: 0 0.25rem 0.375rem;
  margin-left: -0.25rem;
}
.bubble.bb_right:before {
  top: 50%;
  left: auto;
  right: -0.531rem;
  margin-top: -0.313rem;
  border-width: 0 0.25rem 0.438rem;
  transform: rotate(90deg);
}
.bubble.bb_right:after {
  top: 50%;
  left: auto;
  right: -0.375rem;
  margin-top: -0.313rem;
  border-width: 0 0.25rem 0.438rem;
  transform: rotate(90deg);
}
.bubble.bb_left:before {
  top: 50%;
  right: auto;
  left: -0.531rem;
  margin-top: -0.313rem;
  border-width: 0 0.25rem 0.438rem;
  transform: rotate(-90deg);
}
.bubble.bb_left:after {
  top: 50%;
  right: auto;
  left: -0.375rem;
  margin-top: -0.313rem;
  border-width: 0 0.25rem 0.438rem;
  transform: rotate(-90deg);
}

.absolute {
  position: absolute;
}

.swiper_top_text {
  width: 100%;
  transform: translate(0, -3.75rem);
}

.swiper_dot {
  border-radius: 50%;
  width: 0.5rem;
  height: 0.5rem;
  background: var(--primary-pri_40);
}
.swiper_dot.selected {
  background: var(--primary-pri_100);
}
.swiper_dot.small {
  width: 0.375rem;
  height: 0.375rem;
}

.btn_pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  font-size: 0.75rem;
  line-height: 1.25rem;
  border-radius: 0.125rem;
  color: var(--white-w_100-sec);
  font-weight: 500;
}
.btn_pagination.selected {
  background: var(--white-w_16);
}

.playbar_type1_box {
  display: grid;
  grid-template-columns: repeat(auto-fit, 2.625rem);
}

.playbar_type1 {
  font-size: 0.75rem;
  font-weight: 400;
  display: grid;
  grid-auto-rows: auto;
  position: relative;
}
.playbar_type1 .type1_text, .playbar_type1 .default, .playbar_type1 .played, .playbar_type1 .loaded {
  grid-column: 1/1;
  grid-row: 1;
}
.playbar_type1 .type1_text {
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
}
.playbar_type1 .default {
  z-index: 0;
  background: transparent;
}
.playbar_type1 .played {
  z-index: 2;
  background: var(--primary-pri_80);
}
.playbar_type1 .loaded {
  z-index: 1;
  background: var(--primary-pri_40);
}
.playbar_type1 .played_text {
  color: var(--white-w_100);
}
.playbar_type1 .loaded_text {
  color: var(--white-w_100-sec);
}

.playbar_type2_box {
  border-radius: 0.125rem;
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  display: flex;
  padding: 1.25rem 1.25rem 0.75em 0.75em;
  background: var(--blur_02_60);
}
.playbar_type2_box.default {
  flex-direction: column;
}
.playbar_type2_box.mini {
  -webkit-backdrop-filter: blur(1.875rem);
          backdrop-filter: blur(1.875rem);
  padding: 0.75em 3.75rem;
  white-space: nowrap;
}

.playbar_text {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--white-w_87);
}

.playbar_stick {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
.playbar_stick:after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: calc(100% - 0.125rem);
  height: 0.125rem;
  margin: auto;
  background: var(--white-w_60);
  content: "";
}
.playbar_stick .playbar_divider {
  width: 0.063rem;
  height: 0.625rem;
  background: var(--white-w_60);
}
.playbar_stick .playbar_divider_ing {
  width: 3.125rem;
  height: 0.125rem;
  background: var(--primary-pri_100);
}

.playbar_current {
  z-index: 10;
  transform: translate(-0.625rem, -0.625rem);
}

.play_time {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--white-w_87-sec);
}

.playing_time {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--white-w_60);
}

.map_controller {
  position: relative;
  width: 8.125rem;
  height: 8.125rem;
  padding: 1.25rem;
}

.map_circle,
.circle_piece {
  width: 5.625rem;
  height: 5.625rem;
  padding: 0.25rem;
  border-radius: 50%;
  border: 0.063rem solid var(--primary-pri_40);
  background: rgba(0, 0, 0, 0.25) 0% 0% no-repeat padding-box;
  background: var(--etc-bg) 0% 0% no-repeat padding-box;
}

.map_rotate .map_circle {
  position: absolute;
  z-index: 2;
  background: transparent;
}

.circle_piece {
  position: absolute;
  width: 5rem;
  height: 5rem;
  overflow: hidden;
  border: 0.063rem solid var(--primary-pri_100);
  background: rgba(0, 0, 0, 0.25) 0% 0% no-repeat padding-box;
  background: var(--etc-bg) 0% 0% no-repeat padding-box;
}
.circle_piece .btn_direction {
  position: absolute;
  bottom: 50%;
  right: 50%;
  width: 6.25em;
  height: 6.25em;
  transform-origin: 100% 100%;
  overflow: hidden;
  margin-top: -0.65em;
  margin-left: -5em;
  border: 0.063rem solid var(--primary-pri_100);
  box-shadow: 0 0 0.625rem 0 rgba(0, 104, 230, 0.4) inset;
}
.circle_piece .direction_01 {
  transform: rotate(-23deg) skew(45deg);
}
.circle_piece .direction_02 {
  transform: rotate(22deg) skew(45deg);
}
.circle_piece .direction_03 {
  transform: rotate(67deg) skew(45deg);
}
.circle_piece .direction_04 {
  transform: rotate(112deg) skew(45deg);
}
.circle_piece .direction_05 {
  transform: rotate(157deg) skew(45deg);
}
.circle_piece .direction_06 {
  transform: rotate(202deg) skew(45deg);
}
.circle_piece .direction_07 {
  transform: rotate(247deg) skew(45deg);
}
.circle_piece .direction_08 {
  transform: rotate(292deg) skew(45deg);
}
.circle_piece .btn_direction button {
  display: block;
  position: absolute;
  bottom: -3.625em;
  right: -3.625em;
  height: 7.25em;
  width: 7.25em;
  border-radius: 50%;
  padding-top: 0em;
  transform: skew(-45deg) rotate(-70deg) scale(1);
  background-color: transparent;
}
.circle_piece .btn_direction button:active, .circle_piece .btn_direction button:hover, .circle_piece .btn_direction button:focus {
  background: rgba(39, 212, 255, 0.4) 0% 0% no-repeat padding-box;
  background: var(--line-pri_40-to-wh_100);
}

.circle_pointer {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.circle_pointer button {
  position: absolute;
  width: 1rem;
  height: 1rem;
  margin: auto;
  border: none;
  background-color: transparent;
  background-image: url(../images/mapcontrol_navi_arrow_.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1rem auto;
}
.circle_pointer .northside_::before {
  position: absolute;
  content: "";
  z-index: 999 !important;
  bottom: 6.4rem;
  left: 0;
  right: 0;
  width: 0.75rem;
  height: 0.75rem;
  margin: auto;
  background-image: url(../images/mapcontrol_navi_north.svg);
  background-size: 100% auto;
}
.circle_pointer .northside {
  top: 0;
  left: 0;
  right: 0;
}
.circle_pointer .westside {
  top: 0;
  left: 0;
  bottom: 0;
  transform: rotate(-90deg);
}
.circle_pointer .eastside {
  top: 0;
  right: 0;
  bottom: 0;
  transform: rotate(90deg);
}
.circle_pointer .southside {
  left: 0;
  right: 0;
  bottom: 0;
  transform: rotate(180deg);
}

.btn_map_anchor button {
  position: relative;
  width: 2rem;
  height: 2rem;
  border: 0.063rem solid rgba(39, 212, 255, 0.4);
  border-radius: 50%;
  background: transparent;
}
.btn_map_anchor button:hover, .btn_map_anchor button:focus {
  background-color: rgba(39, 212, 255, 0.2);
}

.map_scroll_unit {
  position: absolute;
}

.map_scroll_text {
  position: absolute;
  bottom: -1.875rem;
  white-space: nowrap;
}

.mapcontrol_btn {
  display: flex;
  align-items: center;
  justify-content: center;
}

.control_pad button {
  display: flex;
  flex-direction: column;
  height: 2.25rem;
}
.control_pad .btn_secondary.selected {
  border: none;
  background: rgba(255, 255, 255, 0.16);
}
.control_pad .disabled img {
  opacity: 0.2;
}

.control_plus_minus {
  display: flex;
  flex-direction: column;
}
.control_plus_minus button {
  width: 3.5rem;
  padding: 0.125rem;
}
.control_plus_minus button.disabled {
  color: var(--white-w_20);
}

.control_direction {
  display: flex;
  align-items: center;
}
.control_direction button {
  width: 2.25rem;
  padding: 0 0;
}

.scroll_bar {
  background-color: var(--white-w_40);
}

.tooltip_label.top, .infowindow_box.top, .legend_label.top {
  top: auto !important;
  left: 50%;
  bottom: calc(100% + 0.125rem);
  transform: translate(-50%, 0);
}
.tooltip_label.bottom, .infowindow_box.bottom, .legend_label.bottom {
  top: calc(100% + 0.125rem) !important;
  bottom: auto;
  left: 50%;
  transform: translate(-50%, 0);
}

.legend_label {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.125rem;
  flex-direction: column;
  gap: 0.125rem;
  position: absolute;
  padding: 0.5rem;
  background: rgba(4, 9, 26, 0.8);
  border: 0.063rem solid rgba(255, 255, 255, 0.38);
  white-space: nowrap;
}

.custom_overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 0.125rem;
  padding-top: 0.25rem;
  background-image: url(../images/info_window_graphic.svg);
  background-size: cover;
}
.custom_overlay.large {
  width: 7.5rem;
  height: 7.5rem;
}
.custom_overlay.small {
  width: 5rem;
  height: 5rem;
}

.snackbar_box {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  box-shadow: 0.75rem 0.75rem 1.5rem 0 rgba(4, 9, 26, 0.2);
  padding: 1rem 1.25rem;
  background: var(--background-blur_0260);
  border: 0.063rem solid var(--white-w_40-sec);
}

.snack_btn {
  font-size: 0.875rem;
  font-weight: 500;
  background: transparent;
  border: transparent;
  color: var(--primary-pri_100);
}

.notification_box {
  width: 48.75rem;
}
.notification_box .notification_bg {
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-backdrop-filter: blur(0.156rem);
          backdrop-filter: blur(0.156rem);
  min-height: 2.625rem;
  overflow: hidden;
  border-width: 0.063rem 0 63rem 0;
  border-style: solid;
  -o-border-image: linear-gradient(to right, rgba(39, 212, 255, 0) 0%, var(--hero-border) 50%, rgba(39, 212, 255, 0) 100%);
     border-image: linear-gradient(to right, rgba(39, 212, 255, 0) 0%, var(--hero-border) 50%, rgba(39, 212, 255, 0) 100%);
  border-top: 0.188rem solid var(--hero-notification-border-top);
  border-bottom: 0.188rem solid var(--hero-notification-border-bottom);
  border-image-slice: 1;
  opacity: 1;
  background: linear-gradient(90deg, var(--hero-notification_01) 0%, var(--hero-notification_02) 6.81%, var(--hero-notification_03) 50%, var(--hero-notification_02) 94.31%, var(--hero-notification_01) 100%);
}
.notification_box .notification_title {
  font-size: 1.375rem;
  font-weight: 700;
  text-align: center;
  color: var(--primary-pri_100);
}
.notification_box .btn_notification {
  display: block;
  margin: 0.75rem auto 0;
}
.notification_box.hide .notification_bg {
  min-height: 0;
  height: 0;
  border-width: 0.063rem 0 0 0;
}
.notification_box.hide .btn_notification {
  transform: rotate(180deg);
}

.gnb_box {
  display: flex;
  align-items: center;
  z-index: 1;
  padding: 0 1.25rem;
  background: var(--bg_01_80);
  border-bottom: 0.063rem solid var(--line-wh_20-to-100);
}
.gnb_box:before {
  position: absolute;
  content: "";
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.lnb_box {
  display: flex;
  align-items: center;
  z-index: 1;
  padding: 0 1.25rem;
  background: var(--bg_01_80);
  border-bottom: 0.063rem solid var(--line-wh_20-to-100);
}
.lnb_box:before {
  position: absolute;
  content: "";
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--bg_01_80);
}
.lnb_box.center {
  display: unset;
  padding: 1.25rem 0;
}

.z_index3 {
  z-index: 3 !important;
}

.gnb_box, .footer_nav {
  position: relative;
}
.gnb_box .gnb_anchor, .footer_nav .gnb_anchor {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.btn_gnb_split {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.125rem 0.75rem 0;
  border-radius: 8px;
  font-size: 8px;
  background: transparent;
  color: var(--PRI);
  border: 1px solid var(--PRI);
  border-radius: 8px;
  width: auto !important;
  font-weight: 500;
  color: var(--white-w_87);
  background: var(--white-w_12);
}
.btn_gnb_split:hover, .btn_gnb_split.hover {
  background: var(--white-w_16);
}
.btn_gnb_split.disabled {
  background: var(--white-w_12);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: var(--white-w_20);
}
.btn_gnb_split.selected {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  background: var(--btn-btn_selected);
  color: var(--white-w_100);
}

.gnb_anchor {
  display: flex;
  align-items: flex-start;
}
.gnb_anchor a {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--white-w_60);
  color: var(--more-visible-wh_60-to-100);
}
.gnb_anchor a .selected, .gnb_anchor a:hover, .gnb_anchor a:focus, .gnb_anchor a.on {
  color: var(--primary-pri_100);
  font-weight: 700;
}

.lnb_anchor, .lnb_sub_anchor {
  background: var(--bg_01_80);
  display: flex;
  align-items: flex-start;
}
.lnb_anchor a, .lnb_sub_anchor a {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--white-w_60);
}
.lnb_anchor a.selected, .lnb_anchor a:hover, .lnb_anchor a:focus, .lnb_anchor a.on, .lnb_sub_anchor a.selected, .lnb_sub_anchor a:hover, .lnb_sub_anchor a:focus, .lnb_sub_anchor a.on {
  color: var(--primary-pri_100);
  font-weight: 500;
}
.lnb_anchor a.black, .lnb_sub_anchor a.black {
  color: var(--more-visible-wh_60-to-100);
}
.lnb_anchor.fixed a, .lnb_sub_anchor.fixed a {
  color: var(--more-visible-wh_60-to-100);
}
.lnb_anchor.fixed a .selected, .lnb_anchor.fixed a:hover, .lnb_anchor.fixed a:focus, .lnb_anchor.fixed a.on, .lnb_sub_anchor.fixed a .selected, .lnb_sub_anchor.fixed a:hover, .lnb_sub_anchor.fixed a:focus, .lnb_sub_anchor.fixed a.on {
  color: var(--primary-pri_100);
  font-weight: 500;
}
.lnb_anchor.center, .lnb_sub_anchor.center {
  justify-content: center;
}

.gnb_information {
  display: flex;
  align-items: center;
  margin-left: auto;
}
.gnb_information * {
  line-height: 1;
}

.lnb_box {
  position: absolute;
  top: 2.5625rem;
  left: 0;
  right: 0;
}

.lnb_anchor {
  align-items: stretch;
  width: 100%;
}
.lnb_anchor.on .lnb_sub_anchor {
  height: auto;
  padding: 1.25rem 0;
}
.lnb_anchor.on:after {
  position: absolute;
  content: "";
  left: 0;
  top: 2.5rem;
  width: 100%;
  height: 0.063rem;
  border-bottom: 0.063rem solid var(--line-wh_20-to-100);
}
.lnb_anchor.center.on:after {
  border-bottom: 0.063rem solid transparent;
}

.lnb_anchor__title {
  white-space: nowrap;
  color: var(--more-visible-wh_60-to-100);
}

.lnb_sub_anchor {
  display: flex;
  flex-direction: column;
  height: 0;
  overflow: hidden;
  padding: 0 0;
}

.lnb_administrator {
  position: relative;
}
.lnb_administrator:after {
  position: absolute;
  content: "";
  left: -2.5rem;
  top: 0;
  height: 100%;
  border-left: 0.063rem solid rgba(255, 255, 255, 0.2);
}

.lnb_popup_content {
  position: absolute;
  left: 0;
  right: 0;
  background: var(--bg_01_80);
  border-top: 0.063rem solid var(--line-wh_20-to-100);
}

.lnb_popup_title_bg {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  height: 2.5rem;
  padding: 0 1.25rem;
  background: var(--bg_01_80);
  border-bottom: 0.063rem solid var(--line-wh_20-to-100);
}
.lnb_popup_title_bg span {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--primary-pri_100);
}
.lnb_popup_title_bg span.black {
  color: var(--white-w_100-sec);
}
.lnb_popup_title_bg.page {
  height: 3.5rem;
}

.btn_fnb_tab {
  display: flex;
  align-items: center;
  font-size: 0.875rem;
  font-weight: 500;
  overflow: hidden;
  background-color: var(--bg_01_80);
}
.btn_fnb_tab button, .btn_fnb_tab a {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  background-color: var(--bg_01_80);
  border: 0.063rem solid var(--line-wh_12-to-40);
  color: var(--white-w_87-sec);
}
.btn_fnb_tab button:first-child, .btn_fnb_tab a:first-child {
  border-right: 0;
  border-radius: 0.125rem 0 0 0.125rem;
}
.btn_fnb_tab button:last-child, .btn_fnb_tab a:last-child {
  border-radius: 0 0.125rem 0.125rem 0;
}
.btn_fnb_tab .selected, .btn_fnb_tab button:hover:not(.selected), .btn_fnb_tab a:hover:not(.selected),
.btn_fnb_tab button:focus:not(.selected), .btn_fnb_tab a:focus:not(.selected) {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  font-size: 0.875rem;
  font-weight: 700;
  background: var(--primary-pri_20);
  border: 0.063rem solid var(--line-wh_12-to-40);
  color: var(--primary-pri_100);
  opacity: 1;
}

.fnb_search_bar {
  display: flex;
  align-items: center;
  border-radius: 0.125rem;
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  height: 2.5rem;
  background-color: var(--bg_01_80);
  border: 0.063rem solid var(--line-wh_12-to-100);
}
.fnb_search_bar.on .search_bar_input {
  display: block;
}
.fnb_search_bar .btn_icon:not(:last-child) {
  border-right: 0.063rem solid rgba(255, 255, 255, 0.12);
}

.search_bar_input {
  display: none;
  padding: 0.375rem 0.5rem;
}

.btn_fnb_search {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
}

.footer_nav {
  display: flex;
  align-items: center;
  position: absolute;
  left: 0;
  right: 0;
  height: 3rem;
  background: var(--etc-FNB);
  border-top: 0.063rem solid var(--white-w_12);
}
.footer_nav .icon_ffb {
  box-shadow: unset;
}
.footer_nav .footer_ffb {
  background: var(--bg_01_80);
  box-shadow: unset;
}
.footer_nav .footer_ffb .icon_ffb {
  background: var(--etc-FNB);
  box-shadow: unset;
}
.footer_nav .footer_ffb .icon_ffb:hover, .footer_nav .footer_ffb .icon_ffb.selected {
  background: rgba(39, 212, 255, 0.06);
}

.footer_nav_ {
  display: flex;
  align-items: center;
  position: absolute;
  left: 0;
  right: 0;
  height: 3rem;
  background: var(--bg_01_80);
}

.footer_ffb .icon_ffb {
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: 0;
  border-bottom: 0;
  border-right: 0;
  -webkit-backdrop-filter: unset;
          backdrop-filter: unset;
}

.side_contents {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  box-shadow: 0.25rem 0.25rem 1rem 0 rgba(4, 9, 26, 0.16);
  padding: 1.25rem;
  background: var(--bg_02_60);
  border-width: 0 0.063rem 0.063rem 0.063rem;
  border-radius: 0 0 0.125rem 0.125rem;
  overflow: hidden;
}

.accordion_block.side .accordion_title:hover:not(.disabled), .accordion_block.side .hover.accordion_title,
.accordion_block.side .accordion_title:focus:not(.disabled) {
  background: var(--primary-pri_20);
  border-right: 0.125rem solid var(--primary-pri_100);
  color: var(--primary-pri_100);
}
.accordion_block.side .accord_title_in {
  background: var(--bg_02_60);
}

.menu_box {
  font-size: 0.875rem;
  font-weight: 700;
  height: 2.125rem;
  padding: 0.5rem 1rem;
  border-radius: 0.125rem;
  border: 0.063rem solid rgba(255, 255, 255, 0.12);
  color: var(--white-w_87);
  width: 9rem;
}
.menu_box.on {
  background: var(--primary-pri_20);
  color: var(--primary-pri_100);
}

.selectbox, .selectboxSample {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 0.125rem;
  position: relative;
  padding: 0 0.75rem;
  cursor: pointer;
}
.selectbox.line, .selectboxSample.line {
  box-shadow: 0 0 0 0.063rem inset var(--white-w_40);
}
.selectbox.fill, .selectboxSample.fill {
  background: var(--more-visible-wh_12-to-6);
}
.selectbox.fill .selectbox_text, .selectboxSample.fill .selectbox_text {
  color: var(--white-w_87-sec);
}
.selectbox.fill.line, .selectboxSample.fill.line {
  box-shadow: 0 0 0 0.063rem inset var(--white-w_40);
  background-color: var(--more-visible-wh_12-to-6);
}
.selectbox.on:not(.dropdown), .selectboxSample.on:not(.dropdown) {
  box-shadow: 0 0 0 0.063rem inset var(--primary-pri_100) !important;
  outline: 0.188rem solid var(--primary-pri_20);
}
.selectbox.on .selectbox_text, .selectboxSample.on .selectbox_text {
  color: var(--white-w_87);
}
.selectbox.on .selectbox_arrow, .selectboxSample.on .selectbox_arrow {
  opacity: 1;
  transform: rotate(180deg);
}
.selectbox.on .selectbox_options, .selectboxSample.on .selectbox_options {
  display: block;
}
.selectbox.on .box_bg, .selectboxSample.on .box_bg {
  display: block;
}
.selectbox .selectbox_arrow, .selectboxSample .selectbox_arrow {
  opacity: 0.6;
}
.selectbox .selectbox_text, .selectboxSample .selectbox_text {
  font-size: 0.8125rem;
  font-weight: 400;
  overflow: hidden;
  line-height: 1;
  text-overflow: ellipsis;
  color: var(--white-w_40);
}
.selectbox .selectbox_text.selected, .selectboxSample .selectbox_text.selected {
  color: var(--white-w_87) !important;
}
.selectbox label, .selectboxSample label {
  padding: 0.125rem 0 0;
  cursor: pointer;
}
.selectbox.disabled .selectbox_text, .selectboxSample.disabled .selectbox_text {
  color: var(--white-w_20);
}

.box_bg {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}
.box_bg.on {
  display: block;
}

.hidden_zone {
  display: block;
}

.selectbox_options {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  border-radius: 0.125rem;
  display: none;
  position: absolute;
  z-index: 9;
  top: 1.875rem;
  left: 0;
  right: 0;
  max-height: 7.5rem;
  padding: 0.1875rem 0;
  background-color: var(--bg_01_80);
  border: 0.063rem solid var(--line-pri_40-to-bk_40);
}
.selectbox_options .option {
  display: flex;
  align-items: center;
  font-size: 0.8125rem;
  font-weight: 400;
  height: 1.75rem;
  padding: 0 0.5rem 0 0.75rem;
}
.selectbox_options .option.selected {
  background: var(--primary-pri_20);
}
.selectbox_options .option:hover, .selectbox_options .option:focus {
  background: var(--primary-pri_20);
}

.date_wrap .datebox {
  width: 100% !important;
}

.datebox {
  display: flex;
  align-items: center;
  height: 1.75rem;
  background-color: rgba(255, 255, 255, 0.1);
  border: 0.063rem solid rgba(255, 255, 255, 0);
  border-radius: 0.125rem;
  line-height: 1;
  padding: 0 0.75rem;
}
.datebox.line {
  background-color: transparent;
  border: 0.063rem solid rgba(255, 255, 255, 0.38);
}
.datebox:focus, .datebox.on {
  border: 0.063rem solid #27D4FF !important;
  outline: 0.188rem solid rgba(39, 212, 255, 0.2);
}

.datepicker {
  font-size: 0.8125rem;
  font-weight: 400;
  background-image: url(../images/calendar_fff_24.svg);
  background-repeat: no-repeat;
  background-position: calc(100% - 0.25rem) center;
  background-size: 1.5rem auto;
  color: var(--white-w_87) !important;
}
.datepicker:focus, .datepicker.on {
  background-image: url(../images/calendar_sky_24.svg);
  background-size: 1.5rem auto;
  background-repeat: no-repeat;
  outline: 0.188rem solid var(--primary-pri_20);
  border: 0.063rem solid var(--primary-pri_100);
  color: var(--white-w_87) !important;
}
.datepicker.default {
  color: var(--white-w_40) !important;
}

.stepper_box {
  display: grid;
}
.stepper_box .wrput {
  grid-row: 1/3;
}
.stepper_box .wrput.selected {
  border: 0.063rem solid var(--white-w_60);
}
.stepper_box .wrput.disabled {
  border: 0.063rem solid var(--white-w_12);
  color: var(--white-w_40);
}

.stepper_arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.125rem;
  width: 1rem;
  height: 0.8125rem;
  background: var(--white-w_12);
}
.stepper_arrow:hover img, .stepper_arrow.on img, .stepper_arrow:focus img {
  opacity: 1;
}
.stepper_arrow img {
  opacity: 0.6;
}
.stepper_arrow.disabled img {
  opacity: 0.2;
}
.stepper_arrow.up {
  grid-row: 1/1;
}
.stepper_arrow.down {
  grid-row: 2/3;
}

.image_frame {
  border-radius: 0.125rem;
  position: relative;
  border: 0.063rem solid var(--white-w_12);
  overflow: hidden;
}
.image_frame .image_dimbg {
  background: rgba(10, 11, 20, 0.4);
}
.image_frame:hover .image_dimbg, .image_frame.on .image_dimbg, .image_frame:focus .image_dimbg {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  cursor: pointer;
  background: rgba(162, 164, 184, 0.2);
}

.image_dimbg {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.image_frame_text {
  font-size: 0.6875rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.87);
}

.image_selected {
  position: relative;
  overflow: hidden;
}
.image_selected:hover, .image_selected.hover, .image_selected:focus {
  cursor: pointer;
}
.image_selected:hover .image_dimbg, .image_selected.hover .image_dimbg, .image_selected:focus .image_dimbg {
  background: var(--primary-pri_20) !important;
}
.image_selected.on .image_dimbg {
  border: 0.125rem solid var(--primary-pri_100);
}

.list_block {
  display: flex;
  align-items: center;
  border-radius: 0.125rem;
  font-size: 0.8125rem;
  font-weight: 400;
  overflow: hidden;
  padding: 0.25rem 0.5rem;
  cursor: pointer;
  background: var(--white-w_12);
  color: var(--white-w_100-sec);
}
.list_block:hover:not(.disabled), .list_block.on, .list_block:focus:not(.disabled) {
  background: var(--primary-pri_20);
}
.list_block:hover:not(.disabled) .btn_list_text, .list_block.on .btn_list_text, .list_block:focus:not(.disabled) .btn_list_text {
  color: var(--primary-pri_100);
}
.list_block.disabled {
  cursor: default;
}
.list_block.disabled .btn_list_text {
  color: var(--white-w_40);
}

.list_block .list_texts {
  display: none;
}
.list_block:hover:not(.disabled) .btn_list_text, .list_block.on .btn_list_text, .list_block:focus:not(.disabled) .btn_list_text {
  display: block;
}
.list_block:hover:not(.disabled) .list_texts, .list_block.on .list_texts, .list_block:focus:not(.disabled) .list_texts {
  display: block;
}
.list_block.disabled {
  cursor: default;
}
.list_block.disabled .btn_list_text, .list_block.disabled .list_texts {
  display: block;
  color: var(--white-w_40);
}

.btn_list_text {
  border-radius: 0.125rem;
  font-size: 0.8125rem;
  font-weight: 400;
  height: 100%;
  padding: 0 0.25rem;
  background: var(--white-w_12);
  line-height: 1rem;
  white-space: nowrap;
  color: var(--white-w_87);
}
.btn_list_text.no_line {
  padding: 0;
  background: transparent;
}

.list_usage_box {
  border-radius: 0.125rem;
  display: grid;
  border: 0.063rem solid var(--white-w_20);
  background: var(--white-w_6);
}

.list_text {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.list_texts {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--primary-pri_100);
}
.list_texts.disabled {
  color: var(--white-w_40);
}

.dragdrop_box {
  border-radius: 0.125rem;
  display: grid;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 0.75rem;
  overflow: hidden;
  cursor: pointer;
}
.dragdrop_box.select .dragdrop_bg, .dragdrop_box.drag .dragdrop_bg {
  background: rgba(39, 212, 255, 0.1);
  background: var(--primary-pri_12);
  border: 0.063rem solid var(--primary-pri_40);
}
.dragdrop_box.drag {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  border: 0.188rem solid var(--primary-pri_20);
}
.dragdrop_box.drag .dragdrop_bg {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
}

.dragdrop_text {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  z-index: 1;
}
.dragdrop_text p {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--white-w_100-sec);
}
.dragdrop_text span {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--white-w_60);
}

.dragdrop_bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  background: var(--white-w_6);
}

.dragdrop_number {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.125rem;
  width: 1.5rem;
  height: 1.5rem;
  font-size: 0.875rem;
  line-height: 1.5rem;
  position: absolute;
  z-index: 2;
  top: 0.75rem;
  left: 0.75rem;
  background: rgb(0, 104, 230);
  font-weight: 500;
  color: #ffffff;
}

.table_box {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--white-w_87-sec);
  width: 100%;
  border-collapse: separate;
}
.table_box tr.selected, .table_box tr:hover:not(.disabled):not(.disable):not(.row_type2.disabled):not(.hover), .table_box tr:focus, .table_box tr.hover {
  background: var(--primary-pri_20);
}
.table_box th {
  position: sticky;
  z-index: 1;
  top: 0;
  height: 2.25rem;
  background: var(--more-visible-wh_16-to-6);
  font-weight: 500;
}
.table_box th, .table_box td:not(.disabled):not(.disable):not(.disable), .table_box td:not(.hover) {
  border-right: 0.063rem solid var(--white-w_12);
}
.table_box th:last-child, .table_box td:not(.disabled):not(.disable):not(.disable):last-child, .table_box td:not(.hover):last-child {
  border-right: 0;
}
.table_box td {
  height: 2.25rem;
  border-top: 0.125rem solid var(--etc-bg) !important;
}
.table_box td.hover {
  height: 2.25rem;
  border-top: 0.125rem solid transparent !important;
}
.table_box .row_type1 {
  background: var(--more-visible-wh_16-to-6);
}
.table_box .row_type2 {
  background: var(--more-visible-wh_6-to-100);
}
.table_box .row_error {
  background: rgba(219, 0, 0, 0.08);
  color: #FF1F55;
}

.table_title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--primary-to-grayscale-to-bk);
}

.table__cell {
  position: relative;
  width: auto;
  height: 100%;
}
.table__cell.disable .wrput {
  color: var(--white-w_40);
}
.table__cell.error_on {
  background: var(--primary-pri_20);
}
.table__cell .wrput {
  border-radius: 0;
  width: 100%;
  height: 100%;
  background: transparent;
}
.table__cell .wrput:focus:not(.hover):not(.on):not(.error):not(.disable):not(.disabled), .table__cell .wrput.on, .table__cell .wrput:active:not(.error):not(.disable) {
  border: 0.063rem solid var(--primary-pri_100);
  outline: 0.188rem solid var(--primary-pri_20);
  background: var(--primary-pri_20);
}
.table__cell .wrput:hover:not(.hover):not(.on):not(.error):not(.disable):not(.disabled), .table__cell .wrput.error_on {
  background: var(--primary-pri_20);
}
.table__cell .wrput.error, .table__cell .wrput.error:focus {
  background: rgba(219, 0, 0, 0.2);
  border: 0.063rem solid #D60000 !important;
  outline: 0.188rem solid rgba(219, 0, 0, 0.2);
}
.table__cell.disabled {
  border-right: 0.063rem rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.4);
}

.error_tooltip {
  display: flex;
  align-items: center;
  position: absolute;
  z-index: 9;
  bottom: calc(100% + 0.188rem);
  left: 0;
  height: 1rem;
  padding: 0 0.25rem;
  background: #D60000;
}
.error_tooltip * {
  line-height: 1rem;
}

.sp_search24 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  background: url("../images/search_fff_24.svg") no-repeat center center;
  background-size: cover;
}

.sp_download20 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  background: url("../images/icon_download_20.svg") no-repeat center center;
  background-size: cover;
}

.sp_cctv20 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  background: url("../images/icon_camera_20.svg") no-repeat center center;
  background-size: cover;
}

.sp_x20 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  background: url("../images/icon_x_20.svg") no-repeat center center;
  background-size: cover;
}

.sp_layer24 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  background: url("../images/layer_fff_24.svg") no-repeat center center;
  background-size: cover;
}

.fc_annotation60 {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--white-w_60);
}

.fc_annotation87 {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--white-w_87);
}

.text_label_box {
  font-size: 1.25rem;
  font-weight: 500;
  border-radius: 0.125rem;
  padding: 1.25rem 1.5rem;
  background: var(--primary-pri_12-to-bk);
}

.list_style {
  position: relative;
  padding-left: 1.375rem;
}
.list_style::before {
  content: "";
  display: block;
  position: absolute;
  top: 0.25rem;
  left: 0.5rem;
  width: 0.188rem;
  height: 0.188rem;
  background-color: var(--white-w_60);
  border-radius: 100%;
}

.color_box {
  border-radius: 0.125rem;
  width: 3.75rem;
  height: 3.75rem;
}
.color_box.rainbow1 {
  background-color: #27D4FF;
}
.color_box.rainbow2 {
  background-color: #0068E6;
}
.color_box.rainbow3 {
  background-color: #8972FF;
}
.color_box.rainbow4 {
  background-color: #16D9AB;
}
.color_box.rainbows7 {
  background-color: #9DFFBE;
}
.color_box.rainbows10 {
  background-color: #64EBA7;
}
.color_box.rainbows4 {
  background-color: #16D9AB;
}
.color_box.rainbows14 {
  background-color: #00CBCB;
}
.color_box.rainbows1 {
  background-color: #27D4FF;
}
.color_box.rainbows11 {
  background-color: #16A3E9;
}
.color_box.rainbows2 {
  background-color: #07F;
}
.color_box.rainbows5 {
  background-color: #0E44E5;
}
.color_box.rainbows8 {
  background-color: #0A2ACC;
}
.color_box.rainbows12 {
  background-color: #4D4DFF;
}
.color_box.rainbows6 {
  background-color: #6E3DFF;
}
.color_box.rainbows3 {
  background-color: #8972FF;
}
.color_box.rainbows13 {
  background-color: #B5A6FF;
}
.color_box.rainbows9 {
  background-color: #D4CCFF;
}
.color_box.gradefff {
  background-color: #850404;
}
.color_box.gradeff {
  background-color: #B31212;
}
.color_box.gradef {
  background-color: #E62222;
}
.color_box.gradee {
  background-color: #FC5C34;
}
.color_box.graded {
  background-color: #FC8A18;
}
.color_box.gradec {
  background-color: #FFBC04;
}
.color_box.gradeb {
  background-color: #82D971;
}
.color_box.gradea {
  background-color: #00BD78;
}
.color_box.grade_less1 {
  background-color: #16A3E9;
}
.color_box.grade_less2 {
  background-color: #0068E6;
}
.color_box.grade_less3 {
  background-color: #636771;
}

.color_box_mini {
  border-radius: 0.125rem;
  width: 2.25rem;
  height: 2.25rem;
  background: #D9D9D9;
}
.color_box_mini.rainbow1 {
  background-color: #27D4FF;
}
.color_box_mini.gradec {
  background-color: #FFBC04;
}
.color_box_mini.rainbows4 {
  background-color: #16D9AB;
}

.velocity_result {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  font-weight: 700;
  flex-wrap: wrap;
  width: 100%;
  letter-spacing: 0;
}
.velocity_result .unit {
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  margin: 0 0 0.25rem 0.25rem;
}

.number_label {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 0.75rem;
  background: rgba(0, 255, 0, 0.87);
  font-size: 0.5rem;
  font-weight: 700;
  color: #0A0B14;
}

.inner_title {
  font-size: 1rem;
  font-weight: 500;
  display: flex;
  align-items: center;
  padding: 1.25rem 1rem 1rem 0;
  color: #27D4FF;
}

.tab_button.on {
  position: relative;
}
.tab_button.on:after {
  position: absolute;
  content: "";
  border-radius: 50%;
  top: 0.438rem;
  right: 1.625rem;
  width: 0.25rem;
  height: 0.25rem;
  background: var(--point-error);
}

.inner_box {
  width: 60.75rem;
  height: auto;
  padding: 0.625rem;
  border-radius: 0.5rem;
  background: rgba(0, 0, 0, 0.06);
}

.fc_sub {
  font-size: 0.875rem;
  font-weight: 400;
  color: var(--white-w_60);
}

.fc_contents {
  font-size: 0.875rem;
  font-weight: 400;
  color: var(--white-w_87-sec);
}

.play_bar {
  display: flex;
  align-items: center;
  -moz-column-gap: 1.25rem;
       column-gap: 1.25rem;
  width: 75.5rem;
  height: 100%;
  padding: 0 0 0 0.75rem;
  background: var(--bg_01_80);
}

.time_bar {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--white-w_100-sec);
}

.time_set {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--white-w_100-sec);
}

.imgpopover_box {
  -webkit-backdrop-filter: blur(1.875rem);
  backdrop-filter: blur(1.875rem);
  width: 46.25rem;
  height: 26.563rem;
  padding: 0.625rem;
  border: 0.063rem solid var(--primary-pri_40);
  background: rgba(10, 15, 36, 0.8);
  box-shadow: 0 0 0.75rem 0 rgba(0, 104, 230, 0.4) inset;
}
.imgpopover_box.front {
  border: 0.063rem solid var(--primary-pri_40);
  background: var(--bg_01_80);
  box-shadow: 0 0 0.75rem 0 rgba(0, 104, 230, 0.4) inset;
}
.imgpopover_box img {
  width: 45rem;
  height: 25.313rem;
}

.map_scale {
  display: flex;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  height: 1.125rem;
  padding: 0.25rem;
  background: rgba(0, 0, 0, 0.5);
}

.map_scale_box {
  display: flex;
  padding: 0.125rem 0.25rem;
  align-items: center;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  background: rgba(0, 0, 0, 0.5);
}
.map_scale_box img {
  width: 4.313rem;
  height: 0.563rem;
}

.map_area_circle {
  width: 3.75rem;
  height: 3.75rem;
  border-radius: 3.75rem;
  border: 0.125rem solid var(--primary-pri_100);
  background: var(--etc-bg);
}
.map_area_circle.hover, .map_area_circle:hover {
  border: 0.188rem solid var(--primary-pri_100);
  background: var(--etc-bg);
}
.map_area_circle.selected {
  border: 0.125rem solid var(--primary-pri_100);
  background: var(--etc-bg);
}
.map_area_circle.disabled {
  border: 0.125rem solid var(--primary-pri_40);
  background: var(--white-w_20);
}
.map_area_circle.ver2.hover, .map_area_circle.ver2:hover {
  border: 0.375rem solid var(--primary-pri_20);
  background: var(--map-ver2-hover);
}
.map_area_circle.ver2.selected {
  border: 0.125rem solid rgb(245, 213, 49);
  background: rgba(255, 224, 67, 0.2);
}

.linked_circle {
  width: 3.75rem;
  height: 3.75rem;
  border-radius: 3.75rem;
  border: 0.125rem solid var(--primary-pri_100);
  background: var(--primary-pri_20);
}
.linked_circle.hover, .linked_circle:hover {
  border: 0.125rem solid var(--primary-pri_100);
  background: var(--group-icon-selected);
}
.linked_circle.selected {
  border: 0.125rem solid rgb(245, 213, 49);
  background: rgba(255, 224, 67, 0.2);
}
.linked_circle.disabled {
  cursor: default;
  border: 0.125rem solid var(--white-w_40);
  background: var(--white-w_20);
}

.state_box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
}

.polygon {
  position: relative;
  width: 6.25rem;
  height: 6.25rem;
}

.polygon_text {
  font-size: 0.875rem;
  font-weight: 500;
  position: absolute;
  color: var(--white-w_87);
  top: 2.813rem;
  bottom: 0;
  left: 1.875rem;
  right: 0;
}

.aside {
  position: fixed;
  left: 1rem;
  top: 5.5rem;
  width: 13.75rem;
  height: calc(100% - 6.5rem);
  max-height: 54rem;
  background: #fff;
  border-radius: 10px;
}
.aside.respon {
  width: 64px;
  width: 4rem;
}
.aside.respon .menu_line .menu_icon {
  margin: 0px;
}
.aside.respon .menu_line .menu_tlt {
  display: none;
}
.aside.animate {
  animation: in-aside 1s ease-in-out !important;
}

.aside_wrap {
  position: relative;
  width: 100%;
  height: 100%;
}
.aside_wrap .aside_arrow {
  position: absolute;
  right: -1rem;
  top: 0.5rem;
  z-index: 10;
}

.aside_arrow {
  width: 33px;
  width: 2rem;
  height: 33px;
  height: 2rem;
  background: #fff;
  border-radius: 100%;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.2);
  transition: 0.2s all;
  cursor: pointer;
}
.aside_arrow:hover {
  opacity: 0.8;
}
.aside_arrow .arr_icon_on {
  display: none;
}
.aside_arrow.on .arr_icon {
  display: none;
}
.aside_arrow.on .arr_icon_on {
  display: block;
}

.arrow_in {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.aside_nav {
  width: 100%;
  overflow: hidden;
}

.aside_nav li a {
  display: block;
}

.Dash_body {
  background-color: #F0F0F2;
  width: 100%;
  min-height: 100%;
  overflow: hidden;
  padding: 1rem;
  padding-top: 5.5rem;
  padding-left: 16.5625rem;
}

.Dash_body.respon {
  padding-left: 112px;
  padding-left: 7rem;
}

.menu_line {
  display: flex;
  align-items: center;
  width: 100%;
  height: 56px;
  padding: 0px 16px;
  border-left: 4px solid #fff;
  transition: 0.2s all;
}
.menu_line .menu_icon {
  margin: 0px 10px 0px 0px;
}
.menu_line .menu_tlt {
  padding: 2px 0px 0px 0px;
}
.menu_line:hover {
  background-color: #E4F6F3;
  border-left: 4px solid #E4F6F3;
}
.menu_line:hover .mn_icon {
  display: none;
}
.menu_line:hover .mn_icon_on {
  display: block;
}
.menu_line:hover .menu_tlt {
  color: #00A388;
}
.menu_line.on {
  background-color: #E4F6F3;
  border-left: 4px solid #00B295;
}
.menu_line.on .mn_icon {
  display: none;
}
.menu_line.on .mn_icon_on {
  display: block;
}
.menu_line.on .menu_tlt {
  color: #00A388;
}

.mn_icon {
  opacity: 0.2;
}

.mn_icon_on {
  display: none;
}