@charset "UTF-8";
/*---------------------------------------------------------------
  [Reset]
-----------------------------------------------------------------*/
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html,
body {
  font-size: 16px;
  font-weight: 400;
  color: #454f5b;
}

body {
  min-width: 1920px;
  font-family: Pretendard, Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
}

h1,
h2,
h3,
h4,
h5 {
  font-family: Pretendard, Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
  margin: 0;
  line-height: 100%;
}

ul,
li {
  margin: 0;
  padding: 0;
  list-style: none;
}

dl,
dt,
dd {
  margin: 0;
  padding: 0;
}

a {
  display: inline-block;
  text-decoration: none;
}

span,
time,
em,
i {
  display: inline-block;
  font-style: normal;
}

table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
table tbody {
  vertical-align: top;
}

button {
  display: inline-block;
  width: 100%;
  padding: 0;
  border: 0;
  outline: 0;
  text-align: left;
  font-family: Pretendard, Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
  background: transparent;
  cursor: pointer;
}

select {
  outline: 0;
  cursor: pointer;
  appearance: none;
}

label {
  cursor: pointer;
}

input,
optgroup,
select,
textarea {
  font-family: Pretendard, Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
  outline: 0;
}

input[type='date'] {
  border: 0;
  outline: 0;
}

video {
  object-fit: fill;
}

main,
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

/* 스크롤바 커스텀 */
/* 웹폰트 Pretendard */
@font-face {
  font-family: 'Pretendard';
  font-weight: 900;
  font-display: fallback;
  src: local('Pretendard Black'), url('/font/Pretendard-Black.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 800;
  font-display: fallback;
  src: local('Pretendard ExtraBold'), url('/font/Pretendard-ExtraBold.woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 700;
  font-display: fallback;
  src: local('Pretendard Bold'), url('/font/Pretendard-Bold.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 600;
  font-display: fallback;
  src: local('Pretendard SemiBold'), url('/font/Pretendard-SemiBold.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 500;
  font-display: fallback;
  src: local('Pretendard Medium'), url('/font/Pretendard-Medium.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 400;
  font-display: fallback;
  src: local('Pretendard Regular'), url('/font/Pretendard-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 300;
  font-display: fallback;
  src: local('Pretendard Light'), url('/font/Pretendard-Light.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 200;
  font-display: fallback;
  src: local('Pretendard ExtraLight'), url('/font/Pretendard-ExtraLight.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 100;
  font-display: fallback;
  src: local('Pretendard Thin'), url('/font/Pretendard-Thin.woff2') format('woff2');
}
/*---------------------------------------------------------------
  [help class]
-----------------------------------------------------------------*/
.screen-out {
  overflow: hidden;
  position: absolute;
  width: 0;
  height: 0;
  line-height: 0;
  text-indent: -9999px;
}

.ov-hide {
  overflow: hidden;
}

/*---------------------------------------------------------------
  [로그인]
-----------------------------------------------------------------*/
.login-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
}
.login-wrapper main {
  position: relative;
  width: 380px;
  padding: 20px 30px 43px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 3px 3px 4px 3px rgba(0, 0, 0, 0.25);
}
.login-wrapper main::before {
  content: '';
  display: block;
  width: 100%;
  height: 170px;
  background-image: url('/images/login_bg.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
  filter: grayscale(1);
}
.login-wrapper main h1 {
  position: absolute;
  top: 74px;
  left: 50%;
  transform: translateX(-50%);
}
.login-container {
  margin-top: 34px;
}
.login-container > span {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0 10px;
  padding: 13px 16px 10px;
  border-radius: 5px;
  border: 1px solid #e0e0e0;
}
.login-container > span::before {
  content: '';
  width: 24px;
  height: 24px;
}
.login-container > span input {
  width: 100%;
  height: 25px;
  border: 0;
  outline: 0;
  color: #454f5b;
  font-size: 14px;
}
.login-container > span input::placeholder {
  color: #a6a6a6;
}
.login-container .email::before {
  background: url(/images/icon_mail.png) no-repeat 0 0;
}
.login-container .pwd {
  margin-top: 14px;
}
.login-container .pwd::before {
  background: url(/images/icon_lock.png) no-repeat 0 0;
}

.btn-login {
  display: block;
  width: 100%;
  margin-top: 29px;
  line-height: 54px;
  text-align: center;
  border-radius: 5px;
  color: #fff;
  background: #1f325b;
  box-shadow: 0px 5px 20px 0px rgba(31, 50, 91, 0.25);
}

/*---------------------------------------------------------------
  [공통]
-----------------------------------------------------------------*/
.btn-primary {
  min-width: 92px;
  line-height: 34px;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  text-align: center;
  border-radius: 5px;
  background: #375596;
}

.selectbox {
  width: 100%;
  height: 34px;
  padding: 0 15px;
  border-radius: 6px;
  border: 1px solid #dfe3e8;
  font-size: 14px;
  color: #737c86;
  background: url(/images/icon-arrow-down.png) no-repeat calc(100% - 12px) 50%;
  background-size: 24px;
}

input.datebox {
  width: 100%;
  height: 34px;
  padding: 0 15px;
  border-radius: 6px;
  border: 1px solid #dfe3e8;
  font-size: 14px;
  color: #737c86;
}
/* 2025-80-20 */
input[type='date']::-webkit-calendar-picker-indicator {
  cursor: pointer;
}

.btn-search {
  width: 26px;
  height: 26px;
  background-image: url('/images/icon_search.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
  background-position: 50% 50%;
  background-size: 20px;
  border-radius: 8px;
  border: 1px solid #e0e0e0;
  background-color: #f6f6f6;
}
.btn-excel-down {
  width: 26px;
  height: 26px;
  background-image: url('/images/icon_excel.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
  background-position: 50% 50%;
  background-size: 20px;
  border-radius: 8px;
  border: 1px solid #e0e0e0;
  background-color: #f6f6f6;
}
.btn-play {
  width: 26px;
  height: 26px;
  background-image: url('/images/icon_play.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
  background-position: 50% 50%;
}
.btn-down {
  width: 26px;
  height: 26px;
  background-image: url('/images/icon_down.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
  background-position: 50% 50%;
}
.btn-close {
  width: 30px;
  height: 30px;
  background-image: url('/images/icon_close_white.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
  background-position: 50% 50%;
}

.paging-container {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0 6px;
}
.paging-container button {
  font-size: 16px;
  color: #212b36;
  font-weight: 500;
  text-align: center;
}
.paging-container > button {
  width: 24px;
  height: 24px;
}
.paging-container > button:disabled {
  color: #a6a6a6;
}
.paging-container .num-bind {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0 6px;
}
.paging-container .num-bind button {
  min-width: 32px;
  padding: 0 8px;
  line-height: 32px;
  border-radius: 8px;
}
.paging-container .num-bind button.active {
  background: rgba(145, 158, 171, 0.16);
}

.wrapper > .header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  height: 70px;
  padding: 0 32px;
  border-bottom: 1px solid #dfe3e8;
  background: #f0f0f0;
}
.wrapper > .header .left {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0 42px;
}
.wrapper > .header .left h1 {
  line-height: 30px;
  font-size: 20px;
  font-weight: 700;
  color: #212b36;
}
.wrapper > .header .right {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0 27px;
}
.wrapper > .header .right .user {
  flex: 0 0 auto;
  font-size: 14px;
  font-weight: 700;
}
.wrapper > .header .right button {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0 5px;
  font-size: 14px;
  font-weight: 700;
  color: #737c86;
}
.wrapper > .header .right button::before {
  content: '';
  width: 18px;
  height: 18px;
  background-image: url('/images/icon_user.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
}

.main-container {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  height: calc(100vh - 92px);
}
.main-container > nav {
  position: relative;
  width: 110px;
  padding: 20px 10px 0;
  border-right: 1px solid #dfe3e8;
  box-shadow: 5px 4px 40px 0px rgba(0, 0, 0, 0.05), inset 0px -11px 8px -8px #333;
}
.main-container > nav > a {
  display: block;
  padding: 8px 0;
  line-height: 21px;
  font-size: 14px;
  font-weight: 500;
  color: #212b36;
  text-align: center;
  border-radius: 5px;
  background: #fff;
}
.main-container > nav > a + a {
  margin-top: 10px;
}
.main-container > nav > a::before {
  content: '';
  display: block;
  margin: 3px auto 0;
}
.main-container > nav .btn-crackdown::before {
  width: 20px;
  height: 20px;
  background-image: url('/images/menu1.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
}
.main-container > nav .btn-crackdown.active {
  color: #fff;
  background: #1f325b;
}
.main-container > nav .btn-crackdown.active::before {
  background-image: url(/images/menu1_active.png);
}
.main-container > nav .btn-stats::before {
  width: 20px;
  height: 20px;
  background-image: url('/images/menu2.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
}
.main-container > nav .btn-stats.active {
  color: #fff;
  background: #1f325b;
}
.main-container > nav .btn-stats.active::before {
  background-image: url(/images/menu2_active.png);
}

.main-container > nav .btn-violate::before {
  width: 20px;
  height: 20px;
  background-image: url('/images/menu3.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
}
.main-container > nav .btn-violate.active {
  color: #fff;
  background: #1f325b;
}
.main-container > nav .btn-violate.active::before {
  background-image: url(/images/menu3_active.png);
}

.main-container > nav .btn-setting::before {
  width: 20px;
  height: 20px;
  background-image: url('/images/menu4.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
}
.main-container > nav .btn-setting.active {
  color: #fff;
  background: #1f325b;
}
.main-container > nav .btn-setting.active::before {
  background-image: url(/images/menu4_active.png);
}

.main-container > nav .lang-dropdown-container {
  position: absolute;
  bottom: 12px;
  left: 5px;
  width: 99px;
  border-radius: 6px;
  border: 1px solid #dfe3e8;
}
.main-container > nav .lang-dropdown-container img {
  width: 28px;
  height: 20px;
}
.main-container > nav .lang-dropdown-container > button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0 13px;
  height: 32px;
  font-size: 12px;
  color: #737c86;
  border-radius: 6px;
  background: #fff;
}
.main-container > nav .dropdown-list {
  display: none;
  background: #f1f1f1;
}
.main-container > nav .dropdown-list a {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0 13px;
  width: 100%;
  padding: 8px 6px;
  font-size: 12px;
  color: #737c86;
}
.main-container > nav .dropdown-list a:hover {
  background: #ddd;
}
.main-container > nav .dropdown-list.active {
  display: block;
  position: absolute;
  top: -108px;
  left: 0;
  width: 100%;
}

.main-content {
  flex: 1;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
}
.main-content > aside {
  width: 330px;
  padding: 15px 30px;
  border-right: 1px solid #dfe3e8;
  box-shadow: 5px 4px 40px 0px rgba(0, 0, 0, 0.05), inset 0px -11px 8px -8px #333;
}
.main-content > aside .search-title {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #a6a6a6;
}
.main-content > aside .search-title .bind {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0 8px;
}
.main-content > aside h2 {
  line-height: 42px;
  font-size: 16px;
  font-weight: 700;
  color: #737c86;
}
.main-content > aside .paging-container {
  margin: 0 -17px 0;
}
.main-content > article {
  flex: 1;
}

.search-box {
  margin: 13px 0 16px;
}
.search-box tr:last-child th,
.search-box tr:last-child td {
  padding-bottom: 0;
}
.search-box th {
  padding-bottom: 10px;
  vertical-align: middle;
  text-align: left;
}
.search-box th span {
  line-height: 24px;
  font-size: 16px;
  font-weight: 500;
}
.search-box td {
  padding-bottom: 10px;
}
.search-list {
  overflow: auto;
  height: calc(100vh - 448px);
  margin-bottom: 16px;
}
.search-list .inner {
  margin: 16px 0;
  padding: 8px 10px;
  border-radius: 10px;
}
.search-list button {
  display: block;
  border-bottom: 1px solid #e0e0e0;
  background: #fff;
}
.search-list button.active .inner {
  background: #2a4173;
}
.search-list button.active .inner em {
  font-weight: 700;
  color: #fff;
}
.search-list button.active .inner .info i,
.search-list button.active .inner .info time {
  font-weight: 600;
  color: #fff;
}
.search-list button em {
  line-height: 24px;
  font-size: 16px;
  font-weight: 500;
  color: #212b36;
}
.search-list button .info {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0 5px;
  margin-top: 19px;
  line-height: 21px;
  letter-spacing: -0.5px;
}
.search-list button .info i {
  flex: 1;
  font-size: 14px;
  font-weight: 500;
  color: #454f5b;
}
.search-list button .info time {
  font-size: 12px;
  font-weight: 500;
  color: #a6a6a6;
}

.crackdown > article {
  padding: 0 32px;
}
.crackdown > article h2 {
  line-height: 50px;
  color: #212b36;
  font-size: 18px;
  font-weight: 700;
}

.crackdown-photo-container {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  gap: 0 25px;
}
.crackdown-photo-container img {
  width: 100%;
  display: block;
}

.enlarge-container-left {
  width: 700px;
}
.enlarge-container-left .enlarge-photo {
  height: 416px;
  border: 4px solid #fff;
  border-radius: 10px;
  box-shadow: 5px 8px 5.9px 2px rgba(0, 0, 0, 0.25);
  cursor: pointer;
}
.enlarge-container-left .enlarge-photo button {
  height: 100%;
}
.enlarge-container-left .enlarge-photo img {
  height: 100%;
  border-radius: 10px;
}
.enlarge-container-left .enlarge-photo.data-img-none {
  background: url(/images/img_default.png) no-repeat 50% 50%;
}
.enlarge-container-left .enlarge-photo.data-img-none button,
.enlarge-container-left .enlarge-photo.data-img-none img {
  display: none;
}
.enlarge-container-left .license-plate {
  height: 97px;
  margin-top: 19px;
  border-radius: 10px;
  border: 1px solid #e0e0e0;
  cursor: pointer;
}
.enlarge-container-left .license-plate button {
  height: 100%;
}
.enlarge-container-left .license-plate img {
  height: 100%;
  border-radius: 10px;
  /* object-fit: cover; */
}
.enlarge-container-left .license-plate.data-img-none {
  background: url(/images/img_default.png) no-repeat 50% 50% #e0e0e0;
  background-size: 35%;
}
.enlarge-container-left .license-plate.data-img-none button,
.enlarge-container-left .license-plate.data-img-none img {
  display: none;
}
.enlarge-container-right {
  flex: 1;
}
.enlarge-container-right > header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.enlarge-container-right > header.mt-18 {
  margin-top: 18px;
}
.enlarge-container-right > header .tit {
  line-height: 25px;
  font-size: 18px;
  font-weight: 700;
}
.enlarge-container-right > header .bind {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0 8px;
  font-size: 0;
}
.enlarge-container-right .thumnail-list {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 15px 10px;
  height: 253px;
  overflow: auto;
  padding: 15px;
  border-radius: 10px;
  border: 1px solid #e0e0e0;
}
.enlarge-container-right .thumnail-list.type2 {
  height: 192px;
}
.enlarge-container-right .thumnail-list.type2 li {
  flex: 0 0 calc(50% - 5px);
  height: 160px;
}
.enlarge-container-right .thumnail-list.type2 li button {
  height: 100%;
}
.enlarge-container-right .thumnail-list.type2 li button img {
  height: 100%;
}
.enlarge-container-right .thumnail-list li {
  flex: 0 0 calc(25% - 7.5px);
  height: 103px;
  font-size: 0;
  cursor: pointer;
}
.enlarge-container-right .thumnail-list li button {
  height: 100%;
}
.enlarge-container-right .thumnail-list li button img {
  height: 100%;
  object-fit: cover;
}
.enlarge-container-right .thumnail-list li.data-none {
  flex: 1;
  align-self: center;
  text-align: center;
  height: auto;
  font-size: 20px;
}
.enlarge-container-right .thumnail-list li.data-img-none {
  background: url(/images/img_default.png) no-repeat 50% 50% #e0e0e0;
  background-size: contain;
}
.enlarge-container-right .thumnail-list li.data-img-none button {
  display: none;
}

.crackdown-info-container {
  margin-top: 34px;
  border-top: 1px solid #dfe3e8;
}
.crackdown-info-container th {
  vertical-align: middle;
  text-align: center;
  font-weight: 700;
  background: #f6f6f6;
  border-bottom: 1px solid #dfe3e8;
  border-right: 1px solid #dfe3e8;
}
.crackdown-info-container td {
  height: 40px;
  padding: 0 20px;
  vertical-align: middle;
  text-align: center;
  border-bottom: 1px solid #dfe3e8;
}

.crackdown-info-container td .c-state {
  color: #ff9500;
}

.statistics {
  display: block;
  padding-top: 10px;
}
.statistics main {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  gap: 0 26px;
  margin-top: 27px;
  padding-right: 36px;
}
.statistics main aside {
  flex: 0 0 auto;
  width: 330px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
}
.statistics main aside > div {
  flex: 1;
  width: 100%;
  text-align: center;
  align-content: center;
}
.statistics main aside > div em {
  background: #d0dfff;
}
.statistics main aside > div .tit {
  display: block;
  line-height: 28px;
  font-size: 20px;
  font-weight: 500;
}
.statistics main aside > div em {
  margin-top: 10px;
  line-height: 28px;
  font-size: 20px;
  font-weight: 700;
}
.statistics main article {
  flex: 1;
}

.filter-container {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0 16px;
  min-width: 1746px;
  margin: 0 32px;
  padding: 18px 32px;
  border-radius: 10px;
  border: 1px solid #e0e0e0;
}
.filter-container em {
  flex: 0 0 auto;
  color: #212b36;
}
.filter-container .datebox {
  width: 186px;
}
.filter-container .btn-primary {
  flex: 0;
}

.chart-container {
  overflow: hidden;
  height: 325px;
  border-radius: 10px;
  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.05);
}
.chart-container > img,
.chart-container > svg {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.chart-container:not(:first-child) {
  margin-top: 51px;
}

.modal-wrapper {
  visibility: hidden;
  opacity: 0;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  transition: all 0.3s;
}
.modal-wrapper.active {
  visibility: visible;
  opacity: 1;
}
.modal-container {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1280px;
  height: 800px;
  transform: translate(-50%, -50%);
  border-radius: 10px 10px 0 0;
}
.modal-head {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 10px 20px 10px 30px;
  border-radius: 10px 10px 0 0;
  background: #2a4173;
  cursor: move;
}
.modal-head em {
  flex: 1;
  line-height: 27px;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}
.modal-body {
  height: calc(100% - 50px);
  background: #fff;
}
.modal-body img {
  width: 100%;
  height: 100%;
}
.modal-body video {
  width: 100%;
  height: 100%;
}

/*---------------------------------------------------------------
  [다국어 설정 style]
-----------------------------------------------------------------*/
/* 영어 */
.search-box:lang(en) th span {
  letter-spacing: -1px;
}

footer {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  text-align: right;
  background: rgb(221, 222, 223);
  margin-top: 2px;
}

footer .copylight {
  padding-right: 12px;
  line-height: 20px;
  font-size: 10px;
  color: rgb(76, 76, 76);
}

/*---------------------------------------------------------------
  [위반이력 화면 style]
-----------------------------------------------------------------*/
.violation-container .tbl-wrap {
  overflow-y: auto;
  height: calc(100% - 142px);
  /* thead요소 position: sticky의 border 버그 문제를 해결하기 위해 div요소에 재정의 */
  border-top: 1px solid var(--Grey-300, #dfe3e8);
}
.violation-container .tbl-wrap thead {
  position: sticky;
  top: 0;
}
.violation-container .tbl-wrap thead th {
  height: 42.5px;
  border-top: 0;
}

.violation-container .tbl-wrap tbody td {
  height: 41.5px;
  line-height: normal;
}

/*---------------------------------------------------------------
  [위반이력 팝업 style]
-----------------------------------------------------------------*/
.violation-popup-container {
  border-radius: 0 0 10px 10px;

  .filter-container.type03 {
    margin: 0 31px;
    padding: 18px 3px 9px;
  }

  .crackdown-photo-container {
    height: 529px;
  }

  .enlarge-container-left {
    width: 700px;

    .enlarge-photo {
      height: 416px;
    }

    .license-plate {
      height: 100px;
      margin-top: 16px;
    }

    .data-img-none2 {
      background: #f2f2f2;

      button {
        display: none;
      }
    }
  }

  .enlarge-container-right {
    position: relative;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid #e0e0e0;

    .thumnail-list-v2 {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: flex-start;
      align-items: flex-start;
      gap: 5px;

      li {
        width: 191px;
        height: 130px;
        border: 1px solid #e0e0e0;

        &.data-img-none2 {
          width: 191px;
          height: 130px;
          background: #f2f2f2;

          button {
            display: none;
          }
        }

        &.img-lg {
          overflow: hidden;
          width: calc(50% - 3px);
          height: 200px;
        }

        button {
          display: block;
          height: 100%;

          img {
            height: 100%;
            object-fit: fill;
          }
        }
      }
    }

    & > section {
      height: 225px;
      margin-top: 18px;

      & > em {
        line-height: 22px;
        font-weight: 700;
      }

      .thumnail-list-v2 {
        margin-top: 3px;
      }
    }

    .video {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      display: none;
      margin-top: 0;

      &.active {
        display: block;
      }
    }
  }

  .crackdown-info-container {
    margin-top: 17px;

    td {
      height: 42px;
    }
  }
}

/*---------------------------------------------------------------
  [설정 - 지점 관리 화면 style]
-----------------------------------------------------------------*/
.setting-spot-container .setting-cont-wrap {
  height: calc(100% - 70px);
}
.setting-spot-container .setting-cont-wrap .left .tbl-wrap {
  overflow-y: auto;
  height: calc(100% - 45px);
  /* thead요소 position: sticky의 border 버그 문제를 해결하기 위해 div요소에 재정의 */
  border-top: 1px solid var(--Grey-300, #dfe3e8);
}
.setting-spot-container .setting-cont-wrap .left .tbl-wrap thead {
  position: sticky;
  top: 0;
}
.setting-spot-container .setting-cont-wrap .left .tbl-wrap thead th {
  border-top: 0;
}

/*---------------------------------------------------------------
  [증거 이력 검색 팝업 style]
-----------------------------------------------------------------*/
.layer-popup.type03.violation-popup-wrapper {
  .layer-popup__header {
    justify-content: flex-start;

    button {
      margin-left: auto;
    }
  }

  .filter-container.type03 .left {
    color: #212b36;
    font-size: 20px;
    font-weight: 700;
  }
}

/*---------------------------------------------------------------
  [단속현황 팝업 style]
-----------------------------------------------------------------*/
.layer-popup.crackdown-popup-container {
  .ui-draggable-handle {
    cursor: move;
  }

  .layer-popup__content {
    width: 1200px;
    height: 688px;
    /* background: red; */
    background: #f6f6f6;
    border: 10px solid #f6f6f6;
    border-radius: 0 0 10px 10px;

    .img-list-wrap {
      overflow: hidden;
      width: auto;
      min-height: auto;

      .swiper-button-prev {
        width: 35px;
        height: 35px;
        margin-top: -17.5px;
        background: url(/images/icon_circle_arrow.png) no-repeat 0 0;
        background-size: contain;

        &::after {
          display: none;
        }
      }

      .swiper-button-next {
        width: 35px;
        height: 35px;
        margin-top: -17.5px;
        background: url(/images/icon_circle_arrow.png) no-repeat 0 0;
        background-size: contain;
        transform: rotate(180deg);

        &::after {
          display: none;
        }
      }
    }

    .img-list {
      /* gap: 0 10px; */
      margin: 0;

      li {
        flex: 0 0 auto;
        width: 142px;
        height: 80px;
        margin: 0;
        border: 0;

        button {
          display: block;
          width: 100%;
          height: 100%;
        }

        img {
          width: 100%;
          height: 100%;
        }

        video {
          width: 100%;
        }

        &.data-img-none {
          background: url(/images/img_default.png) no-repeat 50% 50% #e0e0e0;
          background-size: contain;

          button {
            display: none;
          }
        }
      }
    }

    .view-content {
      overflow: hidden;
      height: calc(100% - 95px);
      margin-top: 10px;
      border-radius: 0 0 10px 10px;

      img {
        width: 100%;
        height: 100%;
      }

      video {
        width: 100%;
      }

      &.data-img-none {
        background: url(/images/img_default.png) no-repeat 50% 50% #e0e0e0;
        background-size: contain;

        img,
        video {
          display: none;
        }
      }
    }
  }
}

/*---------------------------------------------------------------
  수정 및 추가 건 2025-08-15
-----------------------------------------------------------------*/
.layer-alert {
  width: 500px;
  height: 230px;
  padding: 0 15px;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  border-radius: 6px;
  border-right: 1px solid var(--Grey-300, #dfe3e8);
  background: var(--Common-White, #fff);
  box-shadow: 5px 4px 40px 0 rgba(0, 0, 0, 0.05);
  /* background-color: #fff; */
  position: absolute;
  left: 20%;
  top: 70%;
  /* z-index: 10; */
}
.layer-alert.center {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.layer-alert.type02 {
  /* left: 50%;
  top: 70%; */
  height: auto;
  padding-bottom: 10px;
}
.layer-alert.type02 .alarm-list-wrap {
  margin: 20px 0 0;
}
.layer-alert.type02 .alarm-list li {
  display: flex;
  /* width: 470px; */
  height: 70px;
  padding: 10px 0;
  margin-bottom: 9px;
  justify-content: flex-start;
  border-radius: 6px;
  border: 1px solid var(--Grey-300, #dfe3e8);
  background: var(--Common-White, #fff);
}
.layer-alert.type02 .alarm-list li .alarm-triangle-wrap {
  width: 45px;
}
.layer-alert.type02 .alarm-list li .alarm-triangle {
  width: 20px;
  height: 18px;
  margin: 0 0 0 15px;
  background: url(/images/icon_alert_triangle02.png) no-repeat 0 0;
}
.layer-alert.type02 .alarm-list li .alarm-detail .alarm-kind {
  color: #212b36;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: Pretendard;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 140%; /* 19.6px */
}
.layer-alert.type02 .alarm-list li .alarm-detail .alarm-date {
  color: var(--SubTxt2, #737c86);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: Pretendard;
  font-size: 12px;
  font-style: normal;
  font-weight: 300;
  line-height: 140%;
}
.layer-alert.type02 .alarm-list li .alarm-detail p {
  margin: 10px 0 0;
  color: var(--SubTxt2, #737c86);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: Pretendard;
  font-size: 12px;
  font-style: normal;
  font-weight: 300;
  line-height: 140%; /* 16.8px */
}
.layer-alert .layer-alert__header {
  display: flex;
  padding: 10px 0;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid var(--Gray300, #a6a6a6);
}
.layer-alert .layer-alert__header .title {
  color: var(--SubTxt2, #737c86);
  font-feature-settings: 'liga' off, 'clig' off;

  /* Subtitle1 */
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 140%; /* 22.4px */
}

.layer-alert .layer-alert__header button {
  width: 24px;
  height: 24px;
  background: url(/images/icon_x.png) no-repeat 0 0;
  font-size: 0;
  line-height: 0;
}
.layer-alert .layer-alert__content {
  display: flex;
  margin-top: 25.5px;
  color: var(--MainTxt, #212b36);
  font-feature-settings: 'ss01' on, 'ss08' on;

  /* Mid/PC | medium | 16px */
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 24px */
}
.layer-alert .layer-alert__content .alert-triangle {
  width: 66px;
  height: 58px;
  background: url(/images/icon_alert_triangle.png) no-repeat 0 0;
  margin: 18.5px 50px 0 24px;
}
.layer-alert .layer-alert__content p {
  margin: 11.5px 0 0;
  line-height: 150%; /* 24px */
}

.layer-alert .layer-alert__bottom {
  display: flex;
  justify-content: center;
}
.layer-alert .layer-alert__bottom button {
  width: 90px;
  height: 35px;
  flex-shrink: 0;
  border-radius: 6px;
  background: #375596;
  color: #fff;
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;

  /* Button1 */
  margin: 18px 0;
  font-family: Pretendard;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 140%; /* 19.6px */
}
.wrapper > .header .right {
  position: relative;
}
.wrapper > .header .right .alarm-bell {
  display: block;
  width: 39px;
  height: 41px;
  background: url(/images/icon_bell.png) no-repeat 0 bottom;
  /* background-size: 100% 100%; */
}
.wrapper > .header .right .alarm-bell::before {
  display: none;
}
.wrapper > .header .right .btn-logout {
  flex: 1;
}
.wrapper > .header .right .alarm-bell.active {
  background-image: url(/images/icon_bell_on.png);
}
.wrapper > .header .right .layer-alert {
  top: 48px;
  left: auto;
  right: 172px;
}
.wrapper > .header .right .layer-alert .alarm-list-wrap {
  overflow-y: auto;
  height: 169px;
}
.tab-type01-wrap {
  margin-top: 10px;
}
.tab-type01-wrap ul {
  display: flex;
  width: calc(100% - 65px);
  justify-content: start;
  align-items: center;
  margin: 0 0 15px 32px;
  border-bottom: 1px solid #a6a6a6;
}
.tab-type01-wrap li {
  display: flex;
  width: auto;
  height: 30px;
  padding: 13px 19px;
  margin-right: 2px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  border-radius: 5px 5px 0 0;
  background: #d9d9d9;
  color: #fff;
}
.tab-type01-wrap li.on {
  background: #2a4173;
}
.tab-type01-wrap li a {
  color: #fff;
  font-size: 14px;
  font-weight: 700;
}
.filter-container .filter-btn {
  display: flex;
  width: 35px;
  height: 36px;
  padding: 2px var(--padding-padding-xs, 8px);
  justify-content: center;
  align-items: flex-start;
  gap: 4px;
  flex-shrink: 0;
  aspect-ratio: 1/1;
}
.filter-container .filter-btn.pdf {
  background: url(/images/Icon_pdf.png) no-repeat 0 0;
}
.filter-container .filter-btn.print {
  background: url(/images/Icon_print.png) no-repeat 0 0;
}
.selectbox02 {
  width: 100%;
  height: 34px;
  padding: 0 15px;
  border-radius: 6px;
  border: 1px solid #dfe3e8;
  font-size: 14px;
  color: #737c86;
  background: url('../images/icon-arrow-down.png') no-repeat calc(100% - 12px) 50%;
  background-size: 24px;
}
.selectbox03 {
  display: flex;
  width: 120px;
  height: 34px;
  padding: 7px 15px;
  align-items: center;
  gap: 29px;
  flex-shrink: 0;
  border-radius: 6px;
  border: 1px solid var(--Grey-300, #dfe3e8);
  background: var(--Common-White, #fff);
  color: var(--SubTxt2, #737c86);
  font-feature-settings: 'liga' off, 'clig' off;

  /* Body2 */
  font-family: Pretendard;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 19.6px */
}
.filter-container .right .filter-btn-search {
  display: flex;
  width: 92px;
  height: 34px;
  padding: 13px 19px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 5px;
  background: var(--Thirdary, #375596);
  color: #fff;

  &.bold {
    font-weight: 700;
  }
}
.filter-container .filter-btn-excel {
  background: url('../images/icon_excel.png') no-repeat 0 0;
  display: flex;
  width: 36px;
  height: 36px;
  padding: var(--padding-padding-xs, 8px);
  justify-content: center;
  gap: var(--margin-margin-xs, 4px);
  flex-shrink: 0;
  aspect-ratio: 1/1;
}
.filter-container.type02 {
  display: flex;
  justify-content: space-between;
  padding-right: 25.5px !important;
}
.filter-container.type02 .left {
  display: flex;
  gap: 10px;
}
.filter-container.type02 .right {
  display: flex;
  gap: 10px;
}
.filter-container.type03 {
  display: flex;
  justify-content: space-between;
  min-width: 1531px;
  border: 0;
  padding: 18px 3px;
  margin: 0 29px;
  gap: 0;
}
.filter-container.type03 .left {
  display: flex;
  gap: 16px;
}
.filter-container.type03 .right {
  display: flex;
  gap: 10px;

  &.vertical-center {
    align-items: center;

    .siam {
      height: 36px;
    }
  }

  .siam-result {
    font-size: 14px;
    color: #ff9500;
  }
}
.filter-container.type04 {
  display: flex;
  justify-content: space-between;
  width: auto;
  min-width: 750px;
  border: 0;
  margin: 0 0 11px;
  padding: 0;
}
.filter-container.type04 > .left {
  display: flex;
  gap: 16px;
}
.filter-container.type04 > .right {
  display: flex;
  gap: 10px;
}
.layer-popup.type03 .layer-popup__header {
  width: 1588px;
}
.layer-popup.type03,
.layer-popup.type03 .layer-popup__content {
  width: 1588px;
  background: #fff;
}

.tbl-wrap {
  margin: 30px 30px 0;
}
.tbl2-wrap {
  margin: 11px 0 30px 0;
  padding-bottom: 10px;
  border-top: 1px solid #a6a6a6;
  border-bottom: 1px solid #dfe3e8;
}
.tbl-wrap.type02 {
  margin: 0;
}
.tbl-type03-wrap {
  border-top: 1px solid var(--Gray300, #a6a6a6);
  padding-top: 12.5px;
  margin: 10px 0 37.5px;
}
.tbl-type03-wrap.bottom-line {
  border-bottom: 1px solid #dfe3e8;
  padding-bottom: 6px;
}
.tbl-type03 th,
.tbl-type03 td {
  line-height: 40px;
  text-align: left;
}
.tbl-type03 tr {
  height: 46px;
}
.tbl2 td {
  vertical-align: middle;
  text-align: center;
  background: #fff;
  padding: 10px 0 0;
}
table.tbl {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}
table.tbl tr {
  border-bottom: 1px solid var(--Grey-300, #dfe3e8);
}
/* 2025-80-20 */
table.tbl tbody tr:hover {
  cursor: pointer;
}
table.tbl th,
table.tbl2 th {
  height: 50px;
  text-align: center;
  border-top: 1px solid var(--Grey-300, #dfe3e8);
  background: #f4f7ff;
  color: var(--SubTxt1, #454f5b);
  font-feature-settings: 'liga' off, 'clig' off;

  /* Subtitle1 */
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 140%; /* 22.4px */
}
table.tbl td {
  height: 50px;
  line-height: 50px;
  vertical-align: middle;
  text-align: center;
  background: #fff;
}
table.tbl td.check {
  display: flex;
  align-items: center; /* 수직 가운데 정렬 */
  justify-content: center; /* 수평 가운데 정렬 */
}
table.tbl tr.checked td {
  background: #f5f5f7;
}
.al {
  text-align: left;
}
.ac {
  text-align: center;
}
.ac2 {
  justify-content: center;
}
.ar {
  text-align: right;
}
.fc-blue01 {
  color: #91b3fa;
}
.fc-orange01 {
  color: #ff9500;
}
.fc-gray01 {
  color: #979ca3;
}

input[type='checkbox'] {
  border: 0;
  outline: 0;
  width: 25px;
  height: 25px;
}

/* 딤드가 필요한 모달 팝업은 layer-popup-container 요소로 감싸기  */
.layer-popup-container {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.layer-popup-container .layer-popup {
  position: static;
  transform: none;
}
.layer-popup {
  width: 1200px;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 10px;
  background: #f6f6f6;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
  z-index: 11;
}
.layer-popup .layer-popup__header {
  display: flex;
  width: 1200px;
  height: 50px;
  padding: 0 20px 0 30px;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
  border-radius: 10px 10px 0 0;
  background: var(--Secondary, #2a4173);
}
.layer-popup .layer-popup__header .title {
  color: var(--Common-White, #fff);
  font-feature-settings: 'ss01' on, 'ss08' on;

  /* Large/PC | Bold | 18px */
  font-family: Pretendard;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%; /* 27px */
  margin: 10px 0px;
}
.layer-popup .layer-popup__header button {
  width: 30px;
  height: 30px;
  background: url('../images/icon_closebutton.png') no-repeat 0 0;
  margin: 10px 0;
  font-size: 0;
  line-height: 0;
}
.layer-popup .layer-popup__content .img-list-wrap {
  width: 1180px;
  min-height: 100px;
  overflow-x: auto;
  overflow-y: hidden;
}
.layer-popup .layer-popup__content .img-list {
  display: flex;
  justify-content: flex-start;
  width: auto;
  margin: 10px;
}
.layer-popup .img-list li {
  margin-right: 10px;
  width: 142px;
  height: 80px;
  border: 1px solid var(--Gray100, #e0e0e0);
}
.layer-popup .img-list li button {
  width: 142px;
  height: 80px;
}
.layer-popup .img-list li.data-img-none {
  background: url(/images/img_default.png) no-repeat 100% 50% #e0e0e0;
  background-size: contain;
}
.layer-popup .layer-popup__content .big-img {
  height: 589px;
  padding: 0 10px 10px;
  background: #f6f6f6;
  border-radius: 0 0 10px 10px;
}
.layer-popup .layer-popup__content .big-img img {
  width: 1180px;
  height: 579px;
}
.pagenation {
  display: flex;
  justify-content: center;
  margin-top: 19px;
  align-items: center;
}
.pagenation .page-list {
  display: flex;
}
.pagenation .page-list li {
  margin-right: 6px;
}
.pagenation .page-list li button,
.pagenation button.arrow {
  width: 32px;
  height: 32px;
  text-align: center;
}
.pagenation .page-list li button:hover {
  border-radius: 8px;
  background: var(--transparent-grey-16, rgba(145, 158, 171, 0.16));
}
.pagenation .arrow.left_double {
  background: url(/images/left_double.png) no-repeat 50%;
}
.pagenation .arrow.left_single {
  background: url(/images/left_single.png) no-repeat 50%;
}
.pagenation .arrow.right_double.active {
  background: url(/images/right_double_active.png) no-repeat 50%;
}
.pagenation .arrow.right_single.active {
  background: url(/images/right_single_active.png) no-repeat 50%;
}

input[type='text'].t-input {
  width: 100%;
  height: 34px;
  padding: 0 15px;
  border-radius: 6px;
  border: 1px solid #dfe3e8;
  font-size: 14px;
  color: #737c86;
}
input[type='text'].t-input.frm-wsize-90 {
  width: 90%;
}
input[type='text'].t-input.frm-wsize-70 {
  width: 70%;
}
input[type='text'].t-input:read-only {
  background: #f6f6f6;
}
.t-textarea {
  width: 100%;
  padding: 10px 15px;
  border-radius: 6px;
  border: 1px solid #dfe3e8;
  font-size: 14px;
  color: #737c86;
}

.enlarge-container-right .thumnail-list.type3 {
  display: flex;
  justify-content: flex-start;
  height: 295px;
  gap: 0;
  overflow-y: hidden;
}
.enlarge-container-right .thumnail-list.type3 li {
  /* flex: 0 0 calc(50% - 3.5px); */
  /* flex: 1; */
  width: 186px;
  height: 124px;
  margin: 0 8px 15px 0;
}
.enlarge-container-right .thumnail-list.type3 li:nth-child(4n) {
  margin-right: 0;
}
.enlarge-container-right .thumnail-list.type3 li button {
  width: 186px;
  height: 100%;
}
.enlarge-container-right .thumnail-list.type3 li button img {
  width: 186px;
  height: 100%;
}
.enlarge-container-right .thumnail-list.type4 {
  display: flex;
  justify-content: space-between;
  height: 224px;
  margin-top: 11.61px;
}
.enlarge-container-right .thumnail-list.type4 li {
  flex: 1;
  height: 192px;
}
.enlarge-container-right .thumnail-list.type4 li button {
  width: 381px;
  height: 100%;
}
.enlarge-container-right .thumnail-list.type4 li button img {
  width: 381px;
  height: 100%;
}

article.evidence {
  padding: 0 31px;
}
.crackdown-info-container.type02 {
  margin-bottom: 20px;
}
button.btn-type01 {
  display: flex;
  justify-content: start;
  align-items: center;
  width: auto;
  padding: 8px 15px 8px 10px;
  border-radius: 5px;
  background: #a3a6b9;
}
button.btn-type01::before {
  content: '';
  width: 22px;
  height: 18px;
  background: url(/images/icon_siren.png) no-repeat 0 0;
  margin-right: 7px;
}
button.btn-type01 span {
  color: var(--White, #fff);
  font-feature-settings: 'liga' off, 'clig' off;

  /* Button1 */
  font-family: Pretendard;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 140%; /* 19.6px */
}

button.btn-type01 {
  &.c-navy {
    background: #375596;
  }

  &.siam {
    justify-content: center;
    min-width: 92px;
    padding: 0;
    line-height: 34px;
  }

  &.siam::before {
    width: 15px;
    height: 15px;
    background: url(/images/icon_siam.png) no-repeat 0 0;
  }
}

button.btn-type02 {
  display: flex;
  justify-content: start;
  align-items: center;
  width: auto;
  padding: 9px 15px 7px 10px;
  border-radius: 5px;
  background: #a3a6b9;
}
button.btn-type02::before {
  content: '';
  width: 15px;
  height: 15px;
  background: url(/images/icon_cancel.png) no-repeat 0 0;
  margin-right: 7px;
}
button.btn-type02 span {
  /* flex: 1; */
  color: var(--White, #fff);
  font-feature-settings: 'liga' off, 'clig' off;

  /* Button1 */
  font-family: Pretendard;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 140%; /* 19.6px */
}
button.btn-type03 {
  width: auto;
  padding: 7px 27.5px;
  border-radius: 5px;
  background: #a3a6b9;
  color: #fff;
  font-feature-settings: 'liga' off, 'clig' off;
  /* Button1 */
  font-family: Pretendard;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 140%; /* 19.6px */
}

button.filter-btn02.paly02 {
  width: 36px;
  height: 36px;
  background: url(/images/icon_play02.png) no-repeat 0 0;
}
button.filter-btn02.save {
  width: 36px;
  height: 36px;
  background: url(/images/icon_save.png) no-repeat 0 0;
}
.setting-cont-wrap {
  margin: 0 35px 0 32px;
  display: flex;
  justify-content: space-between;
}
.setting-cont-wrap > .left {
  width: calc(50% - 16.5px);
}
.setting-cont-wrap > .right {
  width: calc(50% - 16.5px);
  overflow-y: auto;
  height: 718px;
}
.title-btn-type {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.title-btn-type .title {
  color: var(--MainTxt, #212b36);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: Pretendard;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 140%; /* 25.2px */
}
.title-btn-type button {
  width: auto;
}
.content-wrap {
  padding: 26px 32px 0;
}
.title-type02 {
  display: flex;
  color: #2a4173;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: Pretendard;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 140%; /* 28px */
}
.title-type02 .sub-title {
  display: flex;
  justify-content: start;
  align-items: center;
}
.title-type02 .sub-title::after {
  content: '|';
  margin: 0 9px;
}
.items-list-wrap {
  margin-top: 10px;
  padding: 10.5px 39px;
  border-radius: 10px;
  border: 1px solid #e0e0e0;
}
.items-list {
  display: flex;
  justify-content: start;
}
.items-list li {
  width: 25%;
  color: var(--MainTxt, #212b36);
  font-feature-settings: 'ss01' on, 'ss08' on;

  /* Mid/PC | medium | 16px */
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 24px */
}
.items-list li span {
  color: var(--SubTxt1, #454f5b);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: Pretendard;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 140%; /* 28px */
  margin-left: 18.5px;
}
.title-type03 {
  color: var(--SubTxt2, #737c86);
  font-feature-settings: 'liga' off, 'clig' off;
  border-bottom: 1px solid #a6a6a6;

  /* Subtitle1 */
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 140%; /* 22.4px */
  display: flex;
  padding: 10px 0;
  align-items: flex-start;
  margin: 10px 0;
  align-self: stretch;

  &.mt-0 {
    margin-top: 0;
  }
}

.chart-container.type02 {
  height: 220px;
  margin: 10px 0 23px;

  &.mb-0 {
    margin-bottom: 0;
  }
}
.devide2 {
  display: flex;
  justify-content: space-between;
  gap: 31px;
}
.devide2 .left {
  width: 1120px;
}
.devide2 .right {
  flex: 1;
}
.mgt-0 {
  margin-top: 0 !important;
}

.pr-0 {
  padding-right: 0 !important;
}

/* 250823 추가 */
.statistics.v2 {
  main {
    margin-top: 19px;
  }

  .chart-container {
    height: 320px;

    &:not(:first-child) {
      margin-top: 38px;
    }
  }
}

/*---------------------------------------------------------------
  [증거 이력 검색 팝업 > 썸내일 요소 더블 클릭 시 확대된 이미지가 뷰포트 중앙에 오도록 고정하는 스타일]
-----------------------------------------------------------------*/
.thumnail-list-v2.enlarged-active {
  /* position: relative; */
  overflow: hidden;
  height: 100%;
}

.thumnail-list-v2.enlarged-active ~ section {
  display: none;
}

.thumnail-list-v2.enlarged-active .thumnail-item-expanded {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 999;
  /* cursor: zoom-out; */
}

.thumnail-list-v2.enlarged-active .thumnail-item-expanded img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  transition: transform 0.3s ease-out;
  transform: scale(1);
}

/* 확대된 이미지 외의 다른 썸네일들은 숨김 */
.thumnail-list-v2.enlarged-active li:not(.thumnail-item-expanded) {
  display: none;
}