/* BASIC css start */
.history {
  width: 100%;
  display: block;
  text-align: center;
}
.visual {
  position: relative;
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden;
  background: none !important;
  font-size: 0;
}

.visual > img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  transform: none !important;
  object-fit: contain;
}
/* .visual > img {
  max-width: 100%;
} */
.sec_company_type {
  padding: 100px 12px;
  background: #ffffff;
}
.sec_company_type p {
  font-weight: 300;
  font-size: 12px;
  line-height: 19px;
  color: #000;
}


/* 공통이다용 */
.Lg {
  display: block;
}
.Md {
  display: none !important;
}
.full_col2 {
  width: 100%;
  font-size: 0;
}
.full_col2:after {
  display: block;
  content: '';
  clear: both;
}
.full_col2 > div {
  display: inline-block;
  width: 100%;
  font-size: 12px;
  vertical-align: middle;
}

.full_col2 .company_text_wrap {
    padding: 40px 0;
  width: 100%;
  display: block;
}
.full_col2 .col_text_company {
  width: auto;
  display: block;
  vertical-align: middle;
  padding: 0 20px;
}
.full_col2 .col_text_company h3 {
  font-size: 13px;
  line-height: 16px;
  color: #282828;
  margin-bottom: 0px;
}
.full_col2 .col_text_company .ceo_title {
  margin-bottom: 0px;
}
.full_col2 .col_text_company p {
  font-size: 12px;
  line-height: 16px;
  font-weight: 300;
  color: #898989;
  margin-bottom: 15px;
}
.full_col2 .col_text_company p:last-child {
  margin-bottom: 0;
}
.full_col2 .col_text_company > img {
  display: block;
  margin: 0 auto 10px;
}







/* ==========================================
   DINT HISTORY
   MOBILE HORIZONTAL AUTO SLIDER
========================================== */

.dint_history_section {
  position: relative;
  width: 100%;
  padding: 0 0 10px;
  margin: 0;
  background: #ffffff;
  overflow: hidden;
  text-align: left;
}

/* 손가락으로 움직이는 영역 */
.dint_history_scroller {
  position: relative;
  width: 100%;
  height: 550px;
  margin: 0;
  padding: 12px 0;
  box-sizing: border-box;

  overflow-x: auto;
  overflow-y: hidden;

  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;

  /*
   좌우 타임라인 이동과
   위아래 페이지 스크롤 모두 허용
  */
  touch-action: pan-x pan-y;

  user-select: none;
  -webkit-user-select: none;

  scroll-behavior: auto;
  scrollbar-width: none;

  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0%,
    #000 6%,
    #000 94%,
    transparent 100%
  );

  mask-image: linear-gradient(
    to right,
    transparent 0%,
    #000 6%,
    #000 94%,
    transparent 100%
  );
}

.dint_history_scroller::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.dint_history_scroller.is-dragging {
  cursor: grabbing;
}

.dint_history_scroller:after {
  display: none !important;
  content: none !important;
}

/* 전체 타임라인 가로 길이 */
.dint_history_stage {
  position: relative;
  width: 4450px;
  min-width: 4450px;
  height: 550px;
  margin: 0;
  padding: 0;
}

/* 중앙 가로선 */
.dint_history_stage:before {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  top: 320px;
  width: auto;
  height: 1px;
  background: #d8d8d8;
}

/* 연도 공통 */
.dh_event {
  position: absolute;
  left: var(--x);
  top: 0;
  width: var(--w, 220px);
  height: 640px;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* 중앙 점 */
.dh_event:before {
  position: absolute;
  content: "";
  left: 0;
  top: 316px;
  width: 8px;
  height: 8px;
  border: 1px solid #8b8b63;
  border-radius: 50%;
  background: #8b8b63;
  box-sizing: border-box;
  z-index: 3;
}

/* 세로 연결선 */
.dh_event:after {
  position: absolute;
  content: "";
  left: 4px;
  width: 1px;
  background: #d8d8d8;
  z-index: 1;
}

.dh_event.is-up:after {
  top: calc(320px - var(--line));
  height: var(--line);
}

.dh_event.is-down:after {
  top: 320px;
  height: var(--line);
}

/* 텍스트 박스 */
.dh_box {
  position: absolute;
  left: 0;
  width: 100%;
}

.dh_event.is-up .dh_box {
  top: auto;
  bottom: calc(320px + var(--line) + 14px);
}

.dh_event.is-down .dh_box {
  top: calc(320px + var(--line) + 14px);
  bottom: auto;
}

/* 연도 */
.dh_box h4 {
  margin: 0 0 8px;
  padding: 0;

  font-family: 'GeosansLight', 'Noto Sans KR', sans-serif;
  font-size: 24px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0.5px;
  color: #111111;
}

/* 연혁 내용 */
.dh_box p {
  margin: 0;
  padding: 0;

  font-family: 'Noto Sans KR', sans-serif;
  font-size: 10px;
  font-weight: 300;
  line-height: 1.65;
  letter-spacing: -0.04em;

  color: #5f5f5f;
  text-align: left;
  word-break: keep-all;
}

/* ==========================================
   연도별 위치
   HTML 순서 기준
========================================== */

.dh_event:nth-child(1) {
  --x: 34px;
  --line: 85px;
  --w: 190px;
}

.dh_event:nth-child(2) {
  --x: 215px;
  --line: 95px;
  --w: 190px;
}

.dh_event:nth-child(3) {
  --x: 405px;
  --line: 115px;
  --w: 245px;
}

.dh_event:nth-child(4) {
  --x: 630px;
  --line: 110px;
  --w: 235px;
}

.dh_event:nth-child(5) {
  --x: 845px;
  --line: 90px;
  --w: 210px;
}

/* 2013 */
.dh_event:nth-child(6) {
  --x: 1040px;
  --line: 100px;
  --w: 245px;
}

/* 2014 */
.dh_event:nth-child(7) {
  --x: 1270px;
  --line: 90px;
  --w: 285px;
}

/* 2015 */
.dh_event:nth-child(8) {
  --x: 1555px;
  --line: 105px;
  --w: 255px;
}

/* 2016 */
.dh_event:nth-child(9) {
  --x: 1795px;
  --line: 95px;
  --w: 245px;
}

/* 2017 */
.dh_event:nth-child(10) {
  --x: 2025px;
  --line: 115px;
  --w: 250px;
}

/* 2018 */
.dh_event:nth-child(11) {
  --x: 2260px;
  --line: 95px;
  --w: 235px;
}

/* 2019 */
.dh_event:nth-child(12) {
  --x: 2480px;
  --line: 100px;
  --w: 190px;
}

/* 2020 */
.dh_event:nth-child(13) {
  --x: 2660px;
  --line: 85px;
  --w: 210px;
}

/* 2021 */
.dh_event:nth-child(14) {
  --x: 2855px;
  --line: 100px;
  --w: 245px;
}

/* 2022 */
.dh_event:nth-child(15) {
  --x: 3085px;
  --line: 95px;
  --w: 260px;
}

/* 2023 */
.dh_event:nth-child(16) {
  --x: 3325px;
  --line: 105px;
  --w: 260px;
}

/* 2024 */
.dh_event:nth-child(17) {
  --x: 3570px;
  --line: 85px;
  --w: 335px;
}

/* 2025 */
.dh_event:nth-child(18) {
  --x: 3895px;
  --line: 95px;
  --w: 250px;
}

/* 2026 */
.dh_event:nth-child(19) {
  --x: 4130px;
  --line: 85px;
  --w: 240px;
}

/* PC 스크립트에서 화살표가 생성돼도 모바일은 숨김 */
.history_drag_arrow {
  display: none !important;
}

/* 기존 오른쪽 흰색 페이드 제거 */
.dint_history_section:after {
  display: none !important;
}
/* BASIC css end */