@font-face {
  font-family: 'establishRetrosansOTF';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2112@1.0/establishRetrosansOTF.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

/**************************************** CEO 인사말 */
.greeting_wrap .greeting_banner {margin: 50px 0;}
.greeting_wrap .greeting_txt {font-size: 1.125em; line-height: 183%; color: #666; padding: 0 20px; width: fit-content; margin: 0 auto; display: flex; flex-direction: column; align-items: flex-start; text-align: justify;}
.greeting_wrap .greeting_txt p:not(:last-child) {margin-bottom: 30px;}

.vision_wrap {margin-top: 150px;}
.vision_wrap .vision_bg {height: 630px; background: url(/img/sub01/greeting3.jpg) no-repeat 64% center; background-size: cover; position: relative;}
.vision_wrap .vision_bg p {font-size: 2.25em; color: #fff; position: absolute; left: 50%; transform: translateX(-50%); top: 215px; width: max-content; text-align: center;}
.vision_wrap .vision_list {background: rgba(230, 230, 230, 0.25); padding-bottom: 160px;}
.vision_wrap ul {display: flex; justify-content: center; align-items: center; column-gap: 10px; margin-top: -160px; position: relative; z-index: 2;}
.vision_wrap ul li {
  width: calc((100% - 20px)/3);
  height: 360px;
  border: 1px solid #e6e6e6;
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center
}

.vision_wrap ul li figure{
  width: 100px;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #FAFAFA;
  overflow: hidden;
  border-radius: 100%;
}

.vision_wrap ul li figure svg{
  max-width: 50px;
}


.vision_wrap ul li .bold {font-size: 1.875em; margin: 50px 0 10px; letter-spacing: 0;}
.vision_wrap ul li .sm {font-size: 1.125em; color: #666; line-height: 183%;}

.gre__sec2{
  overflow: hidden;
  position: relative;
}

.gre__con_wrap{
  width: 100%;
  position: relative;
  overflow: hidden;
  /* -webkit-perspective: 1000;
  -webkit-backface-visibility: hidden; */
}

.gre__con{
  position: absolute;
}

.gre__back_container,
.gre__cap_container{
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  overflow: hidden;
}

.gre__back_container figure{
  width: 100%;
  height: 100vh;
  overflow: hidden;
  position: absolute;
}

.gre__back_container figure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  
}

.gre__cap_container{
  z-index: 777;
}

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

.gre__cap{
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.gre__cap p{
  text-align: center;
  font-size: 1.875rem;
  font-family: 'establishRetrosansOTF';
  line-height: 2;
  letter-spacing: normal;
  color: #fff;
  position: relative;
  overflow: hidden;
}

.gre__cap p span{
  display: block;
}

/**************************************** 연혁 */
.history_wrap{
  position: relative;
}

.history_wrap section {padding-left: 260px; position: relative;}
.history_wrap section::before {content: ""; display: block; width: 1px; height: 100%; background: #e6e6e6; position: absolute; left: 416px; top: 0;}
.history_wrap section.history4 {padding-bottom: 240px;}
.history_wrap .history_year {display: flex; align-items: baseline; padding-top: 180px;}
/* .history_wrap .history_year:not(:last-child) ul {padding-bottom: 130px;} */
.history_wrap .history_year:last-child ul {padding-bottom: 30px;}
.history_wrap .history_year .year {font-size: 1.875em; font-weight: 700; width: 155px;}
.history_wrap .history_year ul {padding-left: 35px; position: relative;}
.history_wrap .history_year ul::after {content: ""; display: block; width: 8px; height: 8px; border-radius: 50%; background: #222; position: absolute; left: -3.5px; top: 4px;}
.history_wrap .history_year ul li {display: flex; column-gap: 80px; font-size: 1.125em;}
.history_wrap .history_year ul li:not(:last-child) {margin-bottom: 40px;}
.history_wrap .history_year ul li .month {font-weight: 600;}
.history_wrap .history_year ul li .cont {color: #666; padding-right: 20px;}
.history_wrap .history_year ul li .cont p:not(:last-child) {margin-bottom: 20px;}

/* 221227 history 추가 */

.history__back_wrap{
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  /* transform: translate(0) !important; */
  z-index: -1;
  overflow: hidden;
}

.history__back_wrap figure{
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.history__back_wrap img{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* transform: translate3d(0,0,0); */
}

/**************************************** 오시는 길 */
#map {height: 630px; background: url(/img/sub01/map.jpg) no-repeat center center; background-size: cover;}
.contact_wrap {width: calc(100% - 40px); max-width: 1160px; margin: 0 auto; border-top: 3px solid #222; margin-top: 50px;}
.contact_wrap li {display: flex; align-items: center; font-size: 1.125em; padding: 30px 0; border-bottom: 1px solid #e6e6e6;}
.contact_wrap li .lt {width: 170px; padding-left: 30px;}
.contact_wrap li .rt {width: calc(100% - 170px); color: #666;}



@media screen and (max-width: 1440px) {
  .history_wrap section {padding-left: 10vw;}
  .history_wrap section::before {left: calc(10vw + 155.5px);}
}

@media screen and (max-width: 1240px) {
  .history_wrap section {padding-left: 50px;}
  .history_wrap section::before {left: 171px;}
  .history_wrap .history_year .year {width: 120px; font-size: 1.75em;}
  .history_wrap .history_year ul {width: calc(100% - 120px);}
  .history_wrap .history_year ul li {column-gap: 40px; font-size: 1.05em;}
  
  #map {height: 50vw;}
}

@media screen and (max-width: 1024px) {
  .greeting_wrap .greeting_txt p br {display: none;}

  .vision_wrap .vision_bg {height: 550px;}
  .vision_wrap .vision_bg p {font-size: 2.125em; top: 30%; line-height: 125%;}
  .vision_wrap ul {margin-top: -140px;}
  .vision_wrap ul li {height: 330px;}
  .vision_wrap ul li img {width: 90px;}
  .vision_wrap ul li .bold {font-size: 1.75em; margin: 35px 0 10px;}
  .vision_wrap ul li .sm {font-size: 1.05em; line-height: 170%;}
  
  .history_wrap .history_year ul li:not(:last-child) {margin-bottom: 30px;}
  .history_wrap .history_year ul li .cont p:not(:last-child) {margin-bottom: 15px;}
  .history_wrap .history_year ul::after {top: 3px;}

  .gre__cap p{
    font-size: 1.625rem;
    word-break: keep-all;
  }

}

@media screen and (max-width: 768px) {
  .greeting_wrap .greeting_banner {margin: 7% 0;}
  .greeting_wrap .greeting_txt {line-height: 173%; font-size: 1.111em;}

  .vision_wrap {margin-top: 20%;}
  .vision_wrap .vision_bg {height: 500px;}
  .vision_wrap .vision_list {padding-bottom: 15%;}
  .vision_wrap ul {flex-wrap: wrap; row-gap: 10px; margin-top: -150px;}
  .vision_wrap ul li {width: calc((100% - 20px)/2); height: 280px;}
  .vision_wrap ul li img {width: 80px;}
  .vision_wrap ul li .bold {margin: 30px 0 10px;}
  .vision_wrap ul li .sm {line-height: 165%;}

  .history_wrap section {padding-left: 20px;}
  .history_wrap section::before {left: 100px;}
  .history_wrap section.history4 {padding-bottom: 200px;}
  .history_wrap .history_year {padding-top: 160px;}
  .history_wrap .history_year .year {font-size: 1.65em; width: 80px;}
  .history_wrap .history_year ul::after {width: 6px; height: 6px; top: 2px;}
  .history_wrap .history_year ul {padding-left: 30px; width: calc(100% - 80px);}
  .history_wrap .history_year ul li {column-gap: 25px; /* font-size: 1em; */}
  .history_wrap .history_year ul li .month {width: 16px;}

  #map {height: 60vw;}
  .contact_wrap li {padding: 25px 0;}
  .contact_wrap li .lt {width: 120px; padding-left: 15px;}
  .contact_wrap li .rt {width: calc(100% - 120px);}

  .gre__cap p {
    word-break: keep-all;
  }

  .gre__cap p .br_mo{
    display: block;
  }

}

@media screen and (max-width: 540px) {
  .greeting_wrap .greeting_banner {margin: 9% 0;}
  .greeting_wrap .greeting_txt {line-height: 165%; font-size: 3.6vw; width: 100%;}
  .greeting_wrap .greeting_txt p:not(:last-child) {margin-bottom: 25px;}
  .greeting_wrap .greeting_txt p br.br_540 {display: block;}

  .vision_wrap {margin-top: 25%;}
  .vision_wrap .vision_bg {height: 450px;}
  .vision_wrap .vision_bg p {font-size: 2em;}
  .vision_wrap .vision_list {padding-bottom: 25%;}
  .vision_wrap ul {margin-top: -130px;}
  .vision_wrap ul li {width: 100%; height: 240px;}
  .vision_wrap ul li img {width: 70px;}
  .vision_wrap ul li .bold {font-size: 1.75em; margin: 20px 0 10px;}
  .vision_wrap ul li .sm {font-size: 1.111em; line-height: 160%;}

  .history_wrap section::before {display: none;}
  .history_wrap section.history4 {padding-bottom: 180px;}
  .history_wrap .history_year {display: block; padding-top: 100px;}
  .history_wrap .history_year:last-child ul {padding-bottom: 0;}
  .history_wrap .history_year .year {width: 100%; font-size: 1.5em; margin-bottom: 15px; position: relative;}
  .history_wrap .history_year .year::after {content: ""; display: block; width: calc(100% - 80px); height: 1px; background: #e6e6e6; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); mix-blend-mode: multiply;}
  .history_wrap .history_year ul {padding-left: 15px; width: 100%;}
  .history_wrap .history_year ul::after {display: none;}
  .history_wrap .history_year ul li {column-gap: 17px;}
  .history_wrap .history_year ul li:not(:last-child) {margin-bottom: 20px;}
  .history_wrap .history_year ul li .cont {line-height: 155%;}
  .history_wrap .history_year ul li .cont p:not(:last-child) {margin-bottom: 10px;}

  #map {height: 70vw;}
  .contact_wrap {margin-top: 35px;}
  .contact_wrap li {display: block; padding: 20px 10px;}
  .contact_wrap li .lt {width: 100%; margin-bottom: 8px; font-weight: 500; padding-left: 0;}
  .contact_wrap li .rt {width: 100%; line-height: 135%;}

  .gre__cap p {
    font-size: 1.375rem;
  }

  .gre__back_container figure.rt img{
    object-position: -210vw;
  }

  .gre__back_container figure.lt img{
    object-position: -45vw;
  }

  .gre__back_container figure.lt2 img{
    object-position: -80vw;
  }

}