@import url(../../common/js/swiper@11.1.15/swiper.css);
@import url(../../common/css/common.css);

.tit_wrap .tit {
  text-transform: capitalize;
}

.caution_tit {
  margin-top: var(--area24);
}

.dot_list + .img_flex_list {
  margin-top: var(--area32);
}
.basic_unorder_list > li,
.basic_order_list > li {
  margin-top: var(--area24);
}
.basic_unorder_list li h4,
.basic_order_list li h4 {
  padding-bottom: var(--area12);
  line-height: 1.2;
}

.basic_order_list li .circle_num_list h4 {
  font-weight: normal;
}

.basic_unorder_list li p,
.basic_order_list li p {
  line-height: 1.5;
}

.basic_order_list .circle_num_list > li {
  margin-top: var(--area24);
}

.basic_order_list .circle_num_list > li:first-child {
  margin-top: 0;
}
.basic_order_list > li:first-child .circle_num_list > li {
  margin-top: 0;
}

.basic_order_list .reference_mark_list > li {
  margin-left: var(--area-23);
}

.basic_order_list .reference_mark_list > li p {
  padding-left: var(--area1);
}
.basic_order_list .reference_mark_list > li h4 {
  padding-bottom: 0;
}
.basic_order_list .dot_list > li {
  margin-top: var(--area12);
}

.basic_order_list .dot_list > li:first-child {
  margin-top: 0;
}
.basic_order_list .dot_list > li::before {
  font-weight: 700;
}

.basic_order_list .circle_num_list > li::before {
  top: var(--area3);
}
.basic_order_list > li:first-child .circle_num_list > li::before {
  top: var(--area7);
}
.bg_dark_gray {
  background: #141414 !important;
}

.video_wrap video {
  height: 100%;
}

.hover_img:hover .flicker_icon {
  display: none;
}
.btn.on .hover_img .flicker_icon {
  display: block;
  opacity: 0;
  animation-duration: 4s;
  animation-name: flicker;
  animation-iteration-count: infinite;
  -o-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  animation-delay: 0;
  animation-timing-function: linear;
}

.btn.on .hover_img .flicker_icon.type_3 {
  display: block;
  opacity: 0;
  animation-duration: 3s;
  animation-name: flicker_type3;
  animation-iteration-count: infinite;
  -o-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  animation-delay: 0;
  animation-timing-function: linear;
}
.btn.on .hover_img .flicker_icon.type_3 + .flicker_icon.type_3 {
  animation-delay: 1s;
}
.btn.on .hover_img .flicker_icon.type_3 + .flicker_icon.type_3 + .flicker_icon.type_3 {
  animation-delay: 2s;
}

.indicator {
  position: absolute;
  bottom: var(--area38);
  left: 50%;
  transform: translatex(-50%);
  display: flex;
  justify-content: center;
  z-index: 1;
}

.indicator span {
  font-size: 0;
  width: var(--area9);
  height: var(--area9);
  background: #434343;
  border-radius: 100rem;
  margin-left: var(--area8);
  pointer-events: all;
  cursor: pointer;
}

.indicator span:first-child {
  margin-left: 0;
}

.indicator .swiper-pagination-bullet-active {
  background: #b9b9b9;
  cursor: default;
}

.table_wrap table tbody td {
  min-height: var(--area100);
  height: auto;
  padding-top: var(--area20);
  padding-bottom: var(--area20);
}

.btn_wrap {
  min-height: 0;
  display: flex;
}

.btn_wrap > * {
  flex: 1;
  margin-left: var(--area6);
  height: var(--area38);
  font-size: var(--area14);
  color: #fff;
  background-image: url(../img/btn-s.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.btn_wrap > *:hover {
  background-image: url(../img/btn-s-on.png);
}
.btn_wrap > *:first-child {
  margin-left: 0;
}
.btn_wrap > .md {
  background-image: url(../img/btn-m-on.png);
}

.btn_wrap > .lg {
  background-image: url(../img/btn-l.png);
}
.btn_wrap > .lg:hover {
  background-image: url(../img/btn-l-on.png);
}

.btn_wrap > .lg.division {
  background-image: url(../img/btn-l-division.png);
}
.btn_wrap > .lg.division:hover {
  background-image: url(../img/btn-l-division-on.png);
}

.btn_wrap + .btn_wrap {
  margin-top: var(--area8);
}

.btn_wrap.type_checkers {
  flex-wrap: wrap;
  gap: var(--area2);
}

.btn_wrap.type_checkers > * {
  flex: none;
  width: calc((100% - var(--area4)) / 3);
  height: var(--area46);
  margin: 0;
  background-image: none;
  background-color: #313131;
  border-radius: var(--area2);
  color: #808080;
}

.btn_wrap.type_checkers > *.on {
  color: #fff;
}

.btn_wrap.type_checkers > *.on[disabled="disabled"] {
  color: #808080;
}

.tab_btn_wrap {
  text-align: center;
}
.tab_btn_wrap button {
  font-size: var(--font14);
  font-weight: bold;
}
.tab_btn_wrap button + button {
  margin-left: var(--area25);
  position: relative;
}

.tab_btn_wrap button + button:before {
  content: "";
  display: block;
  width: 1px;
  height: var(--area16);
  background: rgba(0, 0, 0, 0.2);
  position: absolute;
  left: var(--area-13);
  top: 50%;
  transform: translatey(-50%);
}
.tab_btn_wrap .on {
  color: #00ae42;
  border-bottom: 2px solid #00ae42;
}

.info_list .tit {
  font-size: var(--area14);
  color: #fff;
}

.info_list > li {
  border-bottom: 1px solid #343434;
  padding: var(--area10) var(--area36) var(--area10) var(--area18);
}

.info_list span {
  font-size: var(--area11);
  color: #808080;
  line-height: 1;
}
.info_list div,
.info_list ul li {
  display: flex;
  width: 100%;
}

.info_list div > *,
.info_list li > * {
  flex: 1;
}
.info_list li div,
.info_list li li {
  margin-top: var(--area9);
}
.info_list li li:first-child {
  margin-top: 0;
}
.arrow_wrap {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
}
.arrow_wrap span {
  color: #fff;
  font-size: var(--area16);
}
.arrow_wrap button {
  width: var(--area33);
}
/* jquery ui datepicker */
.ui-datepicker {
  width: 100%;
  height: var(--area248);
}
.ui-widget-content {
  background: #000;
}
.ui-widget.ui-widget-content {
  border: none;
  padding: 0;
  padding-left: var(--area6);
  padding-right: var(--area6);
  border-radius: 0;
}

.ui-widget-content .ui-state-default {
  width: var(--area24);
  height: var(--area24);
  line-height: var(--area22);
  border-radius: var(--area4);
  background: none;
  padding: var(--area2) var(--area7);
  text-align: center;
  border: none;
  color: #fff;
  font-size: var(--area11);
  font-weight: 400;
  margin-left: auto;
  margin-right: auto;
}

.ui-widget-content .ui-state-default.on {
  border: var(--area2) solid #f5c242;
  padding: 0;
}

.ui-datepicker .ui-datepicker-header {
  background: none;
  border: none;
  color: #fff;
  padding-top: var(--area18);
  padding-bottom: var(--area17);
}

.ui-datepicker .ui-datepicker-header a {
  display: none;
}

.ui-datepicker .ui-datepicker-title {
  color: #fff;
  font-size: var(--area16);
  line-height: 1;
  margin: none;
}

.ui-datepicker .ui-datepicker-title .ui-datepicker-year:after {
  content: ".";
}
.ui-datepicker table {
  font-size: var(--area11);
  margin: 0;
}

.ui-datepicker th {
  color: #fff;
  padding: 0;
  font-size: var(--area11);
  font-weight: 400;
}
.ui-datepicker th:first-child {
  color: #89221b;
}
.ui-datepicker td {
  padding: var(--area3) var(--area7);
}

/* .ui-datepicker td .ui-state-active,
.ui-datepicker-today .ui-state-active {
  background: #f5c242;
} */
.ui-datepicker td .active {
  background: #f5c242;
}

.sc_con .graph_wrap.btn_list li button {
  flex-direction: column;
  justify-content: center;
  align-items: start;
  padding-left: var(--area18);
  padding-right: var(--area18);
  padding-top: var(--area11);
  padding-bottom: var(--area10);
}
.sc_con .graph_wrap.btn_list.type_arrow .circle {
  background: #2a2a2a;
  width: var(--area13);
  height: var(--area13);
  border-radius: var(--area100);
  display: inline-block;
}

.sc_con .graph_wrap.btn_list.type_arrow li button {
  padding-right: var(--area32);
}
.sc_con .graph_wrap.btn_list.type_arrow button > div {
  width: 100%;
  font-size: var(--area12);
  color: #fff;
  display: flex;
  align-items: center;
  line-height: 1.7;
}
.sc_con .graph_wrap.btn_list.type_arrow button > div:last-child {
  justify-content: space-between;
  margin-top: var(--area5);
}

.sc_con .graph_wrap.btn_list.type_arrow button div div:last-child {
  font-size: var(--area11);
  color: #fff;
}
.sc_con .graph_wrap.btn_list.type_arrow button div .circle {
  margin-right: var(--area6);
}
.sc_con .graph_wrap.btn_list.type_arrow .graph {
  width: 68.68%;
  aspect-ratio: 272 / 24;
  background: url(../img/img-expendables-empty.png) no-repeat center / contain;
  padding: var(--area2) var(--area3);
  position: relative;
}

.sc_con .graph_wrap.btn_list.type_arrow .graph .bar {
  background: url(../img/img-expendables-bar.png) no-repeat center / 100% 100%;
  width: 50%;
  height: 100%;
}

.bg_black .btn_list {
  width: 100%;
  min-height: var(--area176);
  padding: var(--area13) var(--area5);
  display: flex;
  flex-direction: column;
}

.bg_black .btn_list li {
  display: flex;
  margin-top: auto;
}

.bg_black .btn_list li:first-child {
  margin-top: 0;
}
.bg_black .btn_list li:last-child {
  margin-top: auto;
}
.bg_black .btn_list li > button {
  margin-right: var(--area10);
  min-width: var(--area108);
  width: var(--area108);
  max-width: var(--area108);
  height: var(--area38);
  background-image: url(../img/btn-xs.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-size: var(--font14);
  color: #fff;
}
.bg_black .btn_list li.on > button:first-child,
.bg_black .btn_list li > button:first-child:hover {
  background-image: url(../img/btn-xs-on.png);
}

.bg_black .btn_list li > button:first-child + * {
  flex: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}
.bg_black .btn_list li > button:first-child + .arrow_wrap {
  justify-content: space-between;
  align-items: center;
}
.bg_black .btn_list li .btn_wrap > button {
  flex: none;
  width: var(--area37);
  height: var(--area37);
}

.bg_black .btn_list li .btn_wrap > button + button {
  margin-left: var(--area10);
}

.bg_black .btn_list li .btn_wrap .btn_lh {
  background-image: url(../img/btn-rotary-l-off.png);
}
.bg_black .btn_list li .btn_wrap .btn_lh:hover {
  background-image: url(../img/btn-rotary-l-hover.png);
}

.bg_black .btn_list li .btn_wrap .btn_lh:disabled:hover {
  background-image: url(../img/btn-rotary-l-off.png);
}

.bg_black .btn_list li .btn_wrap .btn_lh.on {
  background-image: url(../img/btn-rotary-l-on.png);
}
.bg_black .btn_list li .btn_wrap .btn_lh.on:disabled:hover {
  background-image: url(../img/btn-rotary-l-on.png);
}

.bg_black .btn_list li .btn_wrap .btn_lh.on:hover {
  background-image: url(../img/btn-rotary-l-on.png);
}

.bg_black .btn_list li .btn_wrap .btn_rh {
  background-image: url(../img/btn-rotary-r-off.png);
}
.bg_black .btn_list li .btn_wrap .btn_rh:hover {
  background-image: url(../img/btn-rotary-r-hover.png);
}
.bg_black .btn_list li .btn_wrap .btn_rh:disabled:hover {
  background-image: url(../img/btn-rotary-r-off.png);
}

.bg_black .btn_list li .btn_wrap .btn_rh.on {
  background-image: url(../img/btn-rotary-r-on.png);
}
.bg_black .btn_list li .btn_wrap .btn_rh.on:hover {
  background-image: url(../img/btn-rotary-r-on.png);
}

.bg_black .btn_list li .btn_wrap .btn_rh.on:disabled:hover {
  background-image: url(../img/btn-rotary-r-on.png);
}

.bg_black .btn_list li .btn_set_lr {
  width: var(--area61);
  height: var(--area38);
  background-image: url(../img/ic-btn-set-l.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.bg_black .btn_list li .btn_set_lr.on {
  background-image: url(../img/ic-btn-set-r.png);
}

[class*="page_"] > .tit_wrap .icon_wrap img {
  display: inline-block;
}

[class*="page_"] .con_wrap section.video_sec .sec_tit {
  font-size: var(--font16);
  line-height: 1;
  align-items: center;
}

[class*="page_"] .con_wrap section.video_sec .sec_tit img {
  width: var(--area20);
}
[class*="page_"] .con_wrap section.video_sec .sec_con .video_wrap {
  padding-top: var(--area8);
}

.right_wrap > [class*="device_"] {
  display: none;
}

.right_wrap > [class*="device_"].on {
  display: block;
}
.right_wrap > [class*="device_"] .tit_wrap {
  padding-bottom: var(--area58);
}
.right_wrap > [class*="device_"] .con_wrap img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.right_wrap > [class*="device_"] .con_wrap .sc_tit {
  width: 100%;
  display: flex;
  justify-content: start;
}

.right_wrap > [class*="device_"] .con_wrap .sc_tit.type_center {
  justify-content: center;
}

.right_wrap > [class*="device_"] .con_wrap .sc_tit img {
  /* display: inline-block; */
  vertical-align: top;
  margin-right: var(--area13);
  margin-left: 0;
}
.device_frame {
  /* width: var(--area497); */
  height: auto;
  margin-left: auto;
  margin-right: auto;
  box-shadow: 0 80px 80px 0 rgba(0, 0, 0, 0.2);
  border-radius: var(--area16);
  max-width: 100%;
}

.device_frame svg {
  width: 100%;
  height: auto;
}

.device_wrap {
  width: var(--area498);
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.screen {
  width: var(--area278);
  aspect-ratio: 279 / 464;
  z-index: 1;
  position: absolute;
  top: var(--area109);
  left: calc(50% - var(--area2));
  transform: translatex(-50%);
}

.screen > [class*="screen_"] {
  width: 100%;
  height: 100%;
  position: absolute;
  display: none;
  padding-top: var(--area24);
}

.screen > [class*="screen_"].on {
  display: block;
  z-index: 1;
}

.screen > [class*="screen_"] > svg {
  width: var(--area279);
  aspect-ratio: 279 / 440;
}

.screen > [class*="screen_"] .inner_hd + svg {
  margin-top: var(--area-24);
}

.screen > .screen_main > svg {
  aspect-ratio: 279 / 464;
}

.screen.video_wrap video {
  position: absolute;
  top: 0;
  left: 0;
}

.sc_tit {
  padding: var(--area13) var(--area14);
  text-align: left;
  color: #fff;
  font-size: var(--font16);
  line-height: var(--area28);
  background: url(../img/sc_tit_line.png) no-repeat bottom center / contain;
}

.sc_tit > img:first-child,
.sc_hide > img:first-child {
  height: var(--area28);
  margin-right: var(--area13);
}

.sc_hide {
  text-align: left;
  color: #fff;
  font-size: var(--font16);
  line-height: var(--area28);
}

.sc_tit.type_center {
  text-align: center;
  font-size: var(--font16);
}

.sc_con .btn_list li {
  background-image: url(../img/menu-normal.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.sc_con .btn_list li:hover,
.sc_con .btn_list li.on {
  background-image: url(../img/menu-hover.png);
}

.no-hover .sc_con .btn_list li:hover {
  background-image: url(../img/menu-normal.png);
}

.sc_con .btn_list li button {
  color: #fff;
}

.sc_con .btn_list li button {
  font-size: var(--font15);
  height: var(--area60);
  display: flex;
  align-items: center;
  width: 100%;
  padding-left: var(--area21);
}

.sc_con .btn_list.type_arrow li button {
  background: url(../img/ic-list-arrow.png) no-repeat calc(100% - var(--area11)) center / var(--area28);
}

.sc_con .btn_list.type_arrow.inner li button {
  font-size: var(--font11);
}

.sc_con .basic_list li {
  background-image: url(../img/menu-normal.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-size: var(--area13);
  color: #fff;
  height: var(--area60);
  display: flex;
  align-items: center;
  width: 100%;
  padding-left: var(--area21);
  padding-right: var(--area30);
}

.sc_con .basic_list li span {
  margin-left: auto;
}
.sc_con .basic_list li label {
  font-size: var(--area14);
  color: #fff;
  line-height: var(--area25);
}

.basic_list input[type="radio"],
.basic_list input[type="checkbox"],
.radio_list li input[type="radio"] {
  width: var(--area25);
  height: var(--area25);
  appearance: none;
  background: url(../img/ic-check-off.png) no-repeat center / contain;
  vertical-align: top;
}

.basic_list input[type="radio"]:checked,
.basic_list input[type="checkbox"]:checked,
.radio_list li input[type="radio"]:checked {
  background: url(../img/ic-check-on.png) no-repeat center / contain;
}

.basic_list label input[type="radio"],
.basic_list label input[type="checkbox"] {
  margin-right: var(--area15);
}

.basic_list .d_flex label {
  flex: 1;
}

.radio_list {
  display: flex;
  flex-direction: row;
  width: 100%;
}

.radio_list:first-child {
  padding-top: var(--area31);
  padding-bottom: var(--area31);
}

.radio_list li {
  border: none;
  padding-left: var(--area17);
  padding-right: var(--area17);
  flex: 1;
}
.radio_list li label {
  line-height: var(--area25);
  font-size: var(--area14);
  vertical-align: top;
  color: #fff;
}

.radio_list li label.on {
  color: #f5c242;
}

.radio_list li input[type="radio"] {
  appearance: none;
  margin-right: var(--area6);
  vertical-align: top;
}

.sc_con.d_flex {
  flex: auto;
}
.sc_con.d_flex p {
  margin: auto;
  color: #fff;
  font-size: var(--font12);
  line-height: 1.9;
  text-align: center;
  flex: auto;
}

.sc_con .flicking_wrap {
  height: 100%;
}

.sc_ft {
  margin-top: auto;
  padding: var(--area12);
  min-height: var(--area81);
  box-sizing: content-box;
}

.sc_ft div.on {
  height: 100%;
}

.sc_ft .bg_black {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;

  width: 100%;
  height: 100%;
  color: #fff;
  font-size: var(--font14);
}
.sc_ft .bg_black p {
  width: 100%;
  font-size: var(--area12);
  color: #7d7d7d;
}
.sc_ft .bg_black .tit {
  color: #fff;
  width: 100%;
  font-weight: 400;
  font-size: var(--area12);
}

.sc_ft .bg_black + .btn_wrap {
  margin-top: auto;
}

.sc_ft .bg_black .arrow_wrap {
  justify-content: space-between;
  font-size: var(--area23);
  font-weight: 900;
}

.sc_ft.d_flex {
  flex-direction: column;
}

.sc_ft.btn_wrap {
  min-height: 0;
}

.sc_wrap {
  height: 100%;
}
.sc_wrap.d_flex {
  flex-direction: column;
}
.sc_wrap.d_flex .sc_con {
  flex: auto;
}
.sc_wrap.d_flex .sc_con.d_flex {
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.sc_wrap.d_flex .sc_con.d_flex p {
  flex: none;
}

.sc_wrap.d_flex .sc_con.d_flex .btn_wrap {
  width: 100%;
}
.sc_wrap.d_flex .sc_con.d_flex > input[type="text"] {
  width: 100%;
  border: 1px solid #7b7b7b;
  color: #fff;
  font-size: var(--area28);
  padding-left: var(--area16);
  padding-right: var(--area16);
  height: var(--area45);
  font-size: var(--area16);
  text-align: center;
}

.sc_wrap.d_flex .sc_ft.d_flex {
  flex: auto;
}

.keypad_wrap .sc_con {
  display: flex;
  flex: auto;
  justify-content: center;
  align-items: center;
  padding-left: var(--area28);
  padding-right: var(--area28);
}
.keypad_wrap .sc_con input {
  width: 100%;
  border: 1px solid #7b7b7b;
  color: #fff;
  font-size: var(--area28);
  padding-left: var(--area16);
  padding-right: var(--area16);
  height: var(--area45);
}

.keypad_wrap .sc_ft {
  padding: var(--area10) var(--area9);
}
.keypad_wrap .sc_ft svg {
  width: 100%;
  display: block;
  height: auto;
}

.screen_main svg {
  position: relative;
}
.screen_main .inner_hd {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: flex;
  color: #fff;
  justify-content: space-between;
  background: url(../img/bg-timebar.png) no-repeat top left / contain;
}

.screen_main .inner_hd span {
  color: #e1e1e1;
  font-size: var(--font16);
  vertical-align: top;
  font-weight: 200;
}

.screen_main .inner_hd > span {
  padding-left: var(--area26);
  font-style: italic;
  letter-spacing: var(--area1);
}

.screen_main .inner_hd span span {
  padding-left: 0;
  font-size: var(--area13);
  vertical-align: baseline;
}

.screen_main .inner_hd .time + span {
  color: #6e6e6e;
  font-size: var(--area13);
  padding-left: var(--area5);
  padding-right: var(--area11);
}
.screen_main .inner_hd .device_time {
  display: flex;
  align-items: baseline;
}

.screen_menu ul {
  position: absolute;
  top: 0;
  left: 0;
  padding-top: var(--area101);
  padding-left: var(--area26);
  padding-right: var(--area26);
  width: 100%;
  height: 100%;
  text-align: center;
}
.screen_menu ul li + li {
  margin-top: var(--area25);
}
.screen_menu ul li a {
  display: flex;
  color: #fff;
  font-size: var(--font16);
  height: var(--area80);
  align-items: end;
  justify-content: center;
  padding-bottom: var(--area8);
}

.screen_menu ul li:first-child:hover a {
  background: url(../img/menu-01-on.png) no-repeat center / contain;
}

.screen_menu ul li:nth-child(2):hover a {
  background: url(../img/menu-02-on.png) no-repeat center / contain;
}

.screen_menu ul li:nth-child(3):hover a {
  background: url(../img/menu-03-on.png) no-repeat center / contain;
}

.screen_popup_status_past_equipment .sc_ft .bg_black p {
  padding-bottom: var(--area6);
}
.screen_popup_status_past_equipment .sc_ft .bg_black p,
.screen_popup_status_past_equipment .sc_ft .bg_black .tit,
.screen_popup_status_current_equipment .sc_ft .bg_black p,
.screen_popup_status_current_equipment .sc_ft .bg_black .tit {
  padding-left: var(--area8);
  padding-bottom: var(--area6);
}
.screen_popup_status_current_equipment .sc_ft .bg_black .tit + p {
  padding-top: 0;
}
.screen_popup_status_current_equipment .sc_ft .bg_black p {
  padding-top: var(--area20);
  padding-left: var(--area8);
}

[class*="screen_popup_"].md {
  background: url(../img/bg-pop-02.png) no-repeat center / contain;
  width: 88.75%;
  aspect-ratio: 426/280;
  padding-top: 0;
  height: 164rem;

  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

[class*="screen_popup_"].md .sc_tit {
  background: none;
  line-height: var(--area28);
  padding: var(--area8) var(--area14) var(--area4);
  font-size: var(--area14);
}

[class*="screen_popup_"].md .sc_con {
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: var(--area12);
}
[class*="screen_popup_"].sm .sc_ft,
[class*="screen_popup_"].md .sc_ft {
  padding-top: 0;
}

[class*="screen_popup_"].sm {
  background: url(../img/bg-pop-03.png) no-repeat center / contain;
  width: 88.75%;
  aspect-ratio: 426/224;
  padding-top: 0;
  height: 130rem;

  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* 소모품 상세 */
[class*="screen_popup_supplies_detail_"] .sc_wrap.d_flex .sc_con.d_flex {
  text-align: center;
  color: #fff;

  padding: var(--area36) var(--area16) var(--area30);
  flex: none;
}
[class*="screen_popup_supplies_detail_"] .sc_con p {
  margin: 0;
  font-size: var(--area18);
}
[class*="screen_popup_supplies_detail_"] .sc_con .tit {
  font-size: var(--area11);
  text-decoration: underline;
}
[class*="screen_popup_supplies_detail_"] .sc_con .sub_tit {
  font-size: var(--area14);
}
[class*="screen_popup_supplies_detail_"] .sc_con .btn_wrap {
  margin-top: var(--area2);
}

[class*="screen_popup_supplies_detail_"] .sc_con .btn_wrap + .btn_wrap {
  margin-top: var(--area12);
}

[class*="screen_popup_supplies_detail_"] .sc_ft {
  flex: auto;
}
[class*="screen_popup_supplies_detail_"] .sc_ft .tit {
  padding-left: var(--area16);
  padding-right: var(--area16);
  font-size: var(--area14);
  color: #fff;
}

[class*="screen_popup_supplies_detail_"] .sc_ft ol {
  overflow: hidden;
  margin-top: var(--area16);
  padding-left: var(--area32);
  padding-right: var(--area16);
  display: flex;
  flex-wrap: wrap;
  gap: var(--area10) var(--area36);
}
[class*="screen_popup_supplies_detail_"] .sc_ft ol li {
  list-style: decimal;
  color: #fff;
  font-size: var(--area14);
  width: calc((100% - var(--area72)) / 3);
  text-align: right;
}
[class*="screen_popup_supplies_detail_"] .sc_ft ol li span {
  font-size: var(--area12);
}

[class*="screen_popup_cycle_change"] .sc_con {
  padding-left: var(--area12);
  padding-right: var(--area12);
}

.screen > .screen_popup_esc_video {
  padding-top: 0;
  height: auto;
  aspect-ratio: 480/350;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.screen > .screen_popup_esc_video .video_wrap {
  height: auto;
  aspect-ratio: 480/350;
}
.screen_popup_manageability_password_change input {
  padding-top: 3%;
}
.screen_popup_manageability_operating_time .sc_ft {
  box-sizing: border-box;
  min-height: var(--area139);
  font-size: var(--area14);
  padding: var(--area12) var(--area22);
  color: #fff;
}

.screen_popup_manageability_supplies .indicator {
  bottom: var(--area6);
}

.screen_popup_manageability_as_call .sc_con {
  padding-left: var(--area28);
  padding-right: var(--area28);
}
.screen_popup_manageability_as_call .sc_con img {
  width: var(--area37);
  margin-bottom: var(--area25);
}

.screen_popup_manageability_opt_flowrate .flicking_wrap {
  display: none;
  padding-top: var(--area14);
  overflow: visible;
}

.screen_popup_manageability_opt_flowrate .flicking_wrap .flicking .btn_wrap {
  width: var(--area186);
  flex-wrap: wrap;
  gap: var(--area19);
  margin-left: auto;
  margin-right: auto;
}
.screen_popup_manageability_opt_flowrate .flicking_wrap .flicking .btn_wrap button {
  width: calc((100% - var(--area19)) / 2);
  height: auto;
  flex: none;
  margin: 0;
}

.screen_popup_manageability_opt_flowrate .flicking_wrap .flicking .btn_wrap button img {
  width: 100%;
  display: block;
}

.screen_popup_manageability_opt_flowrate .flicking_wrap .flicking .btn_wrap button img:last-child {
  display: none;
}

.screen_popup_manageability_opt_flowrate .flicking_wrap .flicking .btn_wrap button:hover img {
  display: none;
}

.screen_popup_manageability_opt_flowrate .flicking_wrap .flicking .btn_wrap button:hover img:last-child {
  display: block;
}

.screen_popup_manageability_opt_flowrate .flicking_wrap .indicator {
  bottom: var(--area-49);
}

[class*="screen_popup_manageability_opt_flowrate_detail"] .sc_con .btn_list li {
  padding: 0;
}

[class*="screen_popup_manageability_opt_flowrate_detail"] .sc_con .btn_list button {
  width: 100%;
  height: var(--area60);
  display: flex;
  align-items: center;
  font-size: var(--area16);
  line-height: var(--area28);
  color: #fff;
  justify-content: space-between;

  padding-left: var(--area28);
  padding-right: var(--area28);
}
[class*="screen_popup_manageability_opt_flowrate_detail"] .sc_con .btn_list button img {
  width: auto;
  height: var(--area28);
}

[class*="screen_popup_manageability_opt_flowrate_detail"] .sc_wrap.d_flex .sc_con {
  flex: none;
}

[class*="screen_popup_manageability_opt_flowrate_detail"] .sc_ft {
  padding-top: var(--area17);
  padding-bottom: var(--area16);
}

[class*="screen_popup_manageability_opt_flowrate_detail"] .sc_ft .btn_wrap {
  margin-top: 0;
}

[class*="screen_popup_manageability_opt_flowrate_detail"] .sc_ft .bg_black {
  display: none;
  height: auto;
}

[class*="screen_popup_manageability_opt_flowrate_detail"] .sc_ft .bg_black.on {
  display: flex;
  height: auto;
}
[class*="screen_popup_manageability_opt_flowrate_detail"] .sc_ft .bg_black + .btn_wrap {
  margin-top: 0;
}

[class*="screen_popup_manageability_opt_flowrate_detail"] .sc_ft .bg_black.on + .btn_wrap,
[class*="screen_popup_manageability_opt_flowrate_detail"] .sc_ft .bg_black.on + .bg_black + .btn_wrap {
  margin-top: var(--area18);
}
[class*="screen_popup_manageability_opt_flowrate_detail"] .btn_list .empty {
  height: var(--area61);
}

[class*="screen_popup_manageability_opt_flowrate_detail"] .btn_list .empty:hover {
  background-image: url(../img/menu-normal.png);
}

.screen_popup_set_time .sc_con {
  padding-left: var(--area12);
  padding-right: var(--area12);
}
.screen_popup_set_time .radio_list li:first-child {
  padding-left: var(--area18);
}
.screen_popup_set_time .radio_list li:last-child {
  padding-left: var(--area30);
  position: relative;
}

.screen_popup_set_time .radio_list li:last-child::before {
  content: "";
  display: block;
  width: 1px;
  height: var(--area16);
  position: absolute;
  top: var(--area6);
  left: 0;
  background-color: #808080;
}

.screen_popup_set_time .bg_black {
  padding: var(--area26) var(--area18);
}

.screen_popup_set_time .bg_black .arrow_wrap {
  height: 100%;
  align-items: center;
}
.screen_popup_set_time .bg_black .arrow_wrap span {
  font-size: var(--area27);
  font-weight: 900;
}
.screen_popup_set_time .bg_black .daytime_wrap {
  height: 100%;
}
.screen_popup_set_time .bg_black .daytime_wrap > .d_flex > img {
  margin: 0;
}
.right_wrap > [class*="device_"] .screen_popup_set_time .bg_black .daytime_wrap button img {
  width: var(--area31);
  height: auto;
}
.right_wrap > [class*="device_"] .screen_popup_set_time .bg_black .daytime_wrap span button img {
  width: auto;
  height: var(--area30);
}

.screen_popup_set_light .sc_con .basic_list li[data-manual-con],
.screen_popup_set_light .sc_con .basic_list li[data-automatic-con]:last-child {
  border-bottom: none;
  background: none;
}
.screen_popup_set_light .sc_ft {
  background-image: url(../img/line.png);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
}
.screen_popup_set_light .sc_ft .bg_black {
  height: auto;
  padding: var(--area45) var(--area11);
}

.screen_popup_set_light .sc_ft .bg_black .light_graph {
  display: block;
  position: relative;
}
.screen_popup_set_light .sc_ft .bg_black .light_graph svg {
  display: block;
}
.screen_popup_set_light .sc_ft .bg_black .light_graph .bar {
  width: var(--area166);
  background: url(../img/img-bar-luminosity.png) no-repeat center / cover;
  position: absolute;
  height: var(--area10);
  top: var(--area8);
  left: var(--area28);
}

.screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step1 {
  width: calc(var(--area166) / 9);
}
.screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step2 {
  width: calc((var(--area166) / 9) * 2);
}
.screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step3 {
  width: calc((var(--area166) / 9) * 3);
}
.screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step4 {
  width: calc((var(--area166) / 9) * 4);
}
.screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step5 {
  width: calc((var(--area166) / 9) * 5);
}
.screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step6 {
  width: calc((var(--area166) / 9) * 6);
}
.screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step7 {
  width: calc((var(--area166) / 9) * 7);
}
.screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step8 {
  width: calc((var(--area166) / 9) * 8);
}
.screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step9 {
  width: var(--area166);
}
.screen_popup_set_light .sc_ft .btn_wrap {
  padding-top: var(--area22);
}
.screen_popup_set_light .sc_ft .bg_black.daytime_wrap {
  padding-top: var(--area21);
  padding-bottom: var(--area21);
}
.screen_popup_set_light .sc_ft .bg_black.daytime_wrap .btn_wrap {
  margin-left: var(--area32);
  padding-top: 0;
}

.screen_popup_set_light .sc_ft .daytime_wrap img {
  margin: 0;
}
.daytime_wrap {
  height: var(--area116);
  padding: 0;
  font-size: var(--area27);
  font-weight: 900;
}
.daytime_wrap .d_flex {
  width: 100%;
  justify-content: center;
  align-items: center;
}

.daytime_wrap .d_flex > button {
  width: var(--area60);
  height: var(--area45);
}

.daytime_wrap .d_flex > button.on {
  border: var(--area2) solid #f5c242;
}
.daytime_wrap .btn_wrap {
  flex-direction: column;
  gap: var(--area11);
}
.daytime_wrap button {
  height: 100%;
  font-size: 0;
}
.daytime_wrap .btn_wrap button {
  margin-left: 0;
}

.daytime_wrap .btn_wrap img {
  width: var(--area31);
}

.right_wrap > [class*="device_"] .con_wrap .daytime_wrap img {
  display: inline-block;
  vertical-align: top;
  height: var(--area31);
  width: auto;
}

.screen_popup_set_unit .sc_con {
  padding-left: var(--area12);
  padding-right: var(--area12);
}

.screen_popup_set_unit .sc_con ul li {
  margin-top: var(--area19);
}
.screen_popup_set_unit .sc_con ul li li {
  margin-top: 0;
}
.screen_popup_set_unit .sc_con .tit {
  padding-bottom: var(--area13);
  padding-left: var(--area9);
  line-height: 1.428;
  font-size: var(--area16);
  color: #fff;
}

.screen_popup_set_unit .sc_con .radio_list {
  flex-wrap: wrap;
  padding: 0;
}

.screen_popup_set_unit .sc_con .radio_list li {
  flex: none;
  width: 50%;
  padding-top: var(--area17);
  padding-bottom: var(--area17);
}

.screen_popup_set_unit .sc_con .radio_list li label {
  font-size: var(--area16);
}

.screen_popup_set_unit .sc_con .radio_list li input {
  margin-right: var(--area14);
}

.screen_popup_set_lang .sc_con {
  overflow: auto;
}

.screen_popup_set_lang .sc_con .indicator {
  bottom: 0;
}
.screen_popup_set_lang .sc_ft {
  flex: none;
}

.ver_en .page_menu .con_wrap table tbody td span {
  display: block;
}
.page_manageability_operating_supplies .table_wrap td {
  text-align: left;
}

.page_manageability_operating_supplies .table_wrap td:last-child {
  text-align: center;
}
.page_manageability_operating_supplies .table_wrap td:first-child[rowspan] {
  text-align: center;
}

.page_manageability_operating_supplies .table_wrap td a {
  display: inline-block;
  margin: auto;
}

.page_manageability_operating_supplies .table_wrap td a img {
  min-width: 0;
  width: var(--area24);
  max-width: none;
  display: block;
}

.page_driver03 ol + h4 {
  margin-top: var(--area20);
}
/* 스위치, 운전석 */
.device_switch .device_wrap,
.device_driver .device_wrap {
  display: flex;
  justify-content: center;

  width: 100%;
}

/* .right_wrap > .device_driver .tit_wrap {
  padding-bottom: 0;
} */

.ver_en .page_switch06 .tit_wrap .tit span,
.ver_en .page_switch07 .tit_wrap .tit span {
  display: block;
}

.device_radio_on {
  flex-direction: column-reverse;
  overflow: auto;
}

.device_radio_on > * {
  flex: none;
}
.device_radio_on .left_wrap {
  flex: none;
  height: calc(100% - 62.96%);
  padding: var(--area60);
  overflow: visible;
}

.device_radio_on .left_wrap section {
  padding-top: 0;
}

.device_radio_on .right_wrap {
  min-height: 62.96%;
  height: 62.96%;
  max-height: 62.96%;
  flex: none;

  flex-direction: row;
  justify-content: center;
}

.device_radio_on .device_wrap {
  width: var(--area1030);
}

.device_radio_on .device_wrap svg {
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.device_radio_on .right_wrap {
  padding-bottom: 0;
}
.device_radio_on .right_wrap .con_wrap {
  height: calc(100% - var(--area131));
}
.device_radio_on .right_wrap .device_wrap {
  height: 100%;
}

.device_radio svg .hover_img.on image {
  display: block;
}

.page_radio .con_wrap {
  padding-top: 0;
  display: none;
  overflow: auto;

  padding: var(--area60);
  margin: var(--area-60) var(--area-60) 0;
  height: calc(100% + 120rem);
}

.page_radio .con_wrap ol li p {
  font-size: var(--font14);
  color: rgba(0, 0, 0, 0.6);
}
.page_radio .con_wrap.on {
  display: block;
}
.page_radio .tab_btn_wrap {
  padding-top: 0;
  position: absolute;
  top: var(--area-40);
  left: var(--area16);
  height: var(--area40);
  width: auto;
  display: flex;
  z-index: 1;
}
.page_radio .tab_btn_wrap button {
  width: var(--area190);
  height: var(--area40);
  border-radius: var(--area4) var(--area4) 0 0;
  background: rgba(0, 0, 0, 0.05);
  color: rgba(0, 0, 0, 0.6);
  font-size: var(--font14);
}

.page_radio .tab_btn_wrap button.on {
  background: #fff;
  color: #00ae42;
  border: none;
}
.page_radio .tab_btn_wrap button + button {
  margin-left: var(--area4);
}
.page_radio .tab_btn_wrap button + button:before {
  display: none;
}
.page_radio .con_wrap .sec_con {
  display: flex;
  flex-wrap: wrap;
  min-height: var(--area188);
  margin-top: var(--area-4);
}

.page_radio .con_wrap ol {
  width: calc(100% / 3);
}

.page_radio .con_wrap ol li {
  padding-right: var(--area12);
  line-height: var(--area-28);
  padding-left: var(--area40);
  position: relative;
  margin-top: var(--area12);
}
.page_radio .con_wrap ol li span {
  vertical-align: top;
  font-size: var(--font16);
  font-weight: 700;
  width: var(--area28);
  min-width: var(--area28);
  height: var(--area28);
  min-height: var(--area28);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  position: absolute;
  left: 0;
  background: #303030;
  color: #fff;
}

.page_radio .con_wrap ol li.on span {
  background-color: #00ae42;
}
.sec_con > .d_flex {
  gap: var(--area20);
  align-items: center;
  padding-top: var(--area8);
}
.sec_con > .d_flex > img:first-child {
  min-width: var(--area72);
  width: var(--area72);
  max-width: var(--area72);
  height: auto;
}

.sec_con > .d_flex.align_start {
  align-items: start;
}
.dim.xs {
  width: 100%;
}

.dim.xs > div {
  width: 83.33%;
  padding: var(--area18) var(--area24);
  background: #9f9f9f;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: var(--font12);
  font-weight: 700;
  color: #fff;
  text-align: center;
}

.ver_en .screen_popup_set_time .radio_list li:last-child {
  padding-left: var(--area20);
}

[class*="screen_popup_manageability_opt_flowrate_detail"] [data-arrow-value] span {
  flex: auto;
  /* font-size: 0; */
  color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

[class*="screen_popup_manageability_opt_flowrate_detail"] [data-arrow-value] span.num1 {
  background-image: url(../img/num-01.png);
}
[class*="screen_popup_manageability_opt_flowrate_detail"] [data-arrow-value] span.num2 {
  background-image: url(../img/num-02.png);
}
[class*="screen_popup_manageability_opt_flowrate_detail"] [data-arrow-value] span.num3 {
  background-image: url(../img/num-03.png);
}
[class*="screen_popup_manageability_opt_flowrate_detail"] [data-arrow-value] span.num4 {
  background-image: url(../img/num-04.png);
}
[class*="screen_popup_manageability_opt_flowrate_detail"] [data-arrow-value] span.num5 {
  background-image: url(../img/num-05.png);
}

[class*="screen_popup_manageability_opt_flowrate_detail04"] .sc_con .btn_list button img {
  margin-left: 0;
  margin-right: var(--area7);
}
[class*="screen_popup_manageability_opt_flowrate_detail04"] .sc_con .btn_list button span {
  margin-right: auto;
}
@keyframes flicker {
  0% {
    opacity: 0;
  }
  25% {
    opacity: 0;
  }

  26% {
    opacity: 1;
  }

  50% {
    opacity: 1;
  }
  51% {
    opacity: 0;
  }
  75% {
    opacity: 0;
  }
  76% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

@keyframes flicker_type3 {
  0% {
    opacity: 1;
  }
  33% {
    opacity: 1;
  }

  34% {
    opacity: 0;
  }

  66% {
    opacity: 0;
  }
  67% {
    opacity: 0;
  }
  99% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@media (max-width: 2048px) {
  .zoom_area {
    min-height: 100%;
    height: 100%;
  }
  .full.page_cover.on {
    max-height: 100%;
    height: 100%;
  }
}

@media (min-width: 1921px) {
  .screen_popup_set_light .sc_ft .bg_black .light_graph .bar {
    width: 71%;
  }

  .screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step1 {
    width: calc(71% / 9);
  }
  .screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step2 {
    width: calc((71% / 9) * 2);
  }
  .screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step3 {
    width: calc((71% / 9) * 3);
  }
  .screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step4 {
    width: calc((71% / 9) * 4);
  }
  .screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step5 {
    width: calc((71% / 9) * 5);
  }
  .screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step6 {
    width: calc((71% / 9) * 6);
  }
  .screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step7 {
    width: calc((71% / 9) * 7);
  }
  .screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step8 {
    width: calc((71% / 9) * 8);
  }
  .screen_popup_set_light .sc_ft .bg_black .light_graph .bar.step9 {
    width: 71%;
  }
}

@media (max-width: 1280px) {
  .screen {
    /* left: calc(50% + var(--area6)); */

    left: calc(50% - 0.1vw);
  }
}