@charset "utf-8";
@import url("reset.css");

.sub1.subheader-visual {
  background:url(/img/sub-topvisual1.jpg) center 0 no-repeat;
  background-size:cover;
}
.sub2.subheader-visual {
  background:url(/img/sub-topvisual2.jpg) center 0 no-repeat;
  background-size:cover;
}
.sub3.subheader-visual {
  background:url(/img/sub-topvisual3.jpg) center 0 no-repeat;
  background-size:cover;
}
.sub4.subheader-visual {
  background:url(/img/sub-topvisual4.jpg) center 0 no-repeat;
  background-size:cover;
}
.subheader-visual {
  min-width:100%;
  height:326px;
  text-align:center;
  display:flex;
  justify-content:center;
  align-items:center;
}
.subheader-visual>h2 {
  transform:translateY(70%);
  color:#fff;
  font-size:30px;
  font-weight:600;
}

.sub-nav, .sub_inner {
  max-width:1280px;
  margin-left:auto;
  margin-right:auto;
}
.sub-nav>ul {
  display:flex;
}
.sub-nav>ul>li {
  display:block;
  text-align:center;
  position:relative;
}
.sub-nav.sub1>ul>li {
  width:16.666%;
}
.eng.sub-nav.sub1>ul>li,
.sub-nav.sub2>ul>li,
.sub-nav.sub4>ul>li {
  width:33.333%;
}
.sub-nav>ul>li.active::after {
  content:'';
  display:block;
  background-color:#f68c1f;
  width:100%;
  height:8px;
  margin-top:-8px;
  /* position:absolute;
  left:0;
  bottom:0px; */

}
.sub-nav>ul>li>a {
  display:block;
  font-size:18px;
  line-height:70px;
  border-width:1px;
  border-style:solid;
  border-left-color:#e0e0e0;
  border-bottom-color:#e0e0e0;
  border-top-color:transparent;
  box-sizing:border-box;
}
.sub-nav>ul>li:last-child>a {
  border-right-color:#e0e0e0;
}
.sub-nav>ul>li:not(:last-child)>a {
  border-right-color:transparent;
}

.sub_inner {
  padding-bottom:200px;
}
.sub_inner h3 {
  text-align:center;
  padding-top:75px;
  letter-spacing:-1px;
}
.sub_inner h3 strong {
  font-size:42px;
  font-size:38px;
  text-align:center;
}
.sub_headline {
  padding-top:100px;
  padding-top:65px;
  line-height:1.5;
  font-size:38px;
  font-size:28px;
  font-weight:600;
  letter-spacing:-1px;
  text-align:center;
}
.sub_headline.vis {
  padding-top:60px;
}
.sub_headline span {
  font-size:36px;
}
.sub_headline span>i {
  font-size:26px;
}
.sub_headline>p:nth-child(2) {
  font-size:22px;
  font-weight:500;
  padding-top:20px;
}
.sub_headline>p:nth-child(2)>span {
  font-size:26px;
}


/* sub1 이하 */
/* CEO 인사말 */
.greeting {
  display:flex;
}
.sub_inner>.greeting:not(:nth-child(3)) {
  padding-top:50px;
}
.sub_inner>.greeting:nth-child(3) {
  /* padding-top:104px; */
  padding-top:75px;
}
.eng.company .sub_inner>.greeting {
  padding:75px 150px 0;
}
.eng.company .sub_inner>.greeting>img {
  width:100%;
}
.frame_drop {
    fill:#F68C1F;
}
.greet_title {
    /* background: url(/img/ic-greet1.png) 0 0 no-repeat;
    background-size:110px 121px; */
    width:232px;
    height:232px;
    position: relative;
    left:0;
}
.greet_title>.greet_icon {
  position: absolute;
  left:0;
  top:50%;
  text-align:center;
  width:100%;
  transform:translateY(-50%);
}
.greet_title>.greet_icon>img {
  width:40%;
}
.greet_icon>p {
  color:#fff;
  font-size:20px;
  font-weight:500;
  line-height:1.3;
}
.greet_explain {
  padding-left:34px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.greet_explain>p>strong {
  font-size:26px;
}
.greet_explain>p>strong>i {
  display:inline-block;
  padding-left:10px;
}
.greet_explain>p>strong>br {
  display:none;
}
.greet_explain>p:nth-child(2) {
  font-size:18px;
  word-break:keep-all;
  padding-top:20px;
}
.sign_ceo {
  text-align:right;
}




/* 비전 */
.vis_visual {
    display:flex;
    flex-direction:column;
    align-items:center;
    padding-top:62px;
}
.vis_visual img {
    width:40%;
}
.vision_list {
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    justify-content:space-evenly;
    padding-top:67px;
}
.vision_list>li {
    height:394px;
    width:30%;
    width:28%;
    position:relative;
    display:flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
}
.vision_name {
    width:180px;
    height:180px;
    border-radius:300px;
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
}
.vision_name>p {
    font-size:30px;
    line-height:1.3;
    color:#fff;
    text-align:center;
}
.vision_name>p:first-child {
    font-size:30px;
}
.vision_name>p:last-child {
    font-size:24px;
    font-weight:400;
}
.vision_name>p:last-child::before {
    content:'';
    display:block;
    width:113px;
    height:1px;
    background-color:#fff;
    margin:14px auto;
}

/* 서브 영문 1-2 */
.eng .vision_name>p:first-child {
  font-size:28px;
}
.eng .vision_name>p:last-child {
  font-size:22px;
  line-height:1.2;
}
.eng .vision_list>li:nth-child(3) .vision_name>p:last-child {
  margin-bottom:-20px;
}
.eng .vision_name>p:last-child::before {
  width:33px;
  margin:8px auto;
}

.vision_list>li:first-child .vision_name {
    background-color:#f68b1d;
}
.vision_list>li:nth-child(2) .vision_name {
    background-color:#58a796;
}
.vision_list>li:last-child .vision_name {
    background-color:#42a6c8;
}
.vision_category {
    position:absolute;
    z-index:-1;
    top:108px;
    display:flex;
    justify-content:center;
    background-color:#fff;
    border-radius:30px;
    width:100%;
    height:280px;
}
.vision_list>li:first-child .vision_category {
    box-shadow: rgb(246, 139, 29) 0px 0px 0px 6px;
    color:#f68b1d;
}
.vision_list>li:nth-child(2) .vision_category {
    box-shadow: rgb(88, 167, 150) 0px 0px 0px 6px;
    color:#58a796;
}
.vision_list>li:last-child .vision_category {
    box-shadow: rgb(66, 166, 200) 0px 0px 0px 6px;
    color:#42a6c8;
}
.vision_category p {
    display:flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    font-size:20px;
    font-weight:400;
    text-align:center;
    line-height:1.6;
    margin-top:68px;
}

.cor_history {
  display:flex;
  flex-direction:column;
  align-items:center;
  max-width:1500px;
  position: relative;
}



/*********** 회사연혁 TABLINK******************/
 /* Style the tab */
.tabs_history {
  padding-top:75px;
  width:100%;
}
.tab {
    display: flex;
    flex-direction: row;
    justify-content: center;
}

/* Style the buttons inside the tab */
.tab button {
  background-color:inherit;
  float:left;
  border:none;
  outline:none;
  cursor:pointer;
  /* padding: 14px 20px; */
  width:189px;
  height:66px;
  line-height:1.4;
  transition: 0.2s;
  font-size:24px;
  font-weight:500;
  background-color:#f7f7f7;
  box-shadow:rgb(202, 202, 202) 0px 0px 0px 1px;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color:#f68b1d;
  box-shadow:rgb(246, 139, 29) 0px 0px 0px 1px;
  color:#fff;
}


/* Style the tab content */
.tabcontent {
  display: none;
  padding: 0.5em 1em;
  border-top: none;
  width:100%;
}
/**************END TABLINK *********************/




/*==================================
    회사연혁 타임라인 TIMELINE
==================================*/
/*-- GENERAL STYLES
------------------------------*/
.wrap_timeline {
  padding-top:44px;
}
.timeline {
  line-height: 1.4em;
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
}
.timeline h1, .timeline h2, .timeline h3, .timeline h4, .timeline h5, .timeline h6 {
  line-height: inherit;
}
.timeline h5 {
  color:#3d4349;
  font-weight:900;
  font-size:30px;
  padding-bottom:30px;
  letter-spacing:-3px
}
/*----- TIMELINE ITEM -----*/
.timeline-item {
  padding-left: 40px;
  position: relative;
}
.timeline-item:last-child {
  padding-bottom: 0;
}

/*----- TIMELINE MARKER -----*/
.timeline-marker {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 15px;
}
.timeline-marker:before {
  background: #f68b1d;;
  border: 3px solid transparent;
  border-radius: 100%;
  content: "";
  display: block;
  height: 15px;
  position: absolute;
  top: 4px;
  top:2px;
  left:50%;
  transform:translateX(-50%);
  width: 15px;
  transition: background 0.3s ease-in-out, border 0.3s ease-in-out;
}
.timeline-marker:after {
  content: "";
  width:2px;
  background: #cacaca;
  display: block;
  position: absolute;
  top: 24px;
  bottom: 0;
  left:50%;
  transform:translateX(-50%);
}
/* .timeline-item:first-child .timeline-marker:before, */
.timeline-item:last-child .timeline-marker:after {
  content: none;
}

.timeline-item:not(.period):hover .timeline-marker:before {
  background: transparent;
  border: 3px solid #f68b1d;;
}

/*----- TIMELINE CONTENT -----*/
.timeline-content {
  padding-bottom: 40px;
}
.timeline-content p {
  font-size:18px;
  line-height:1.2;
  font-weight:400;
}
.timeline-content p:nth-child(n+3) {
  padding-top:16px;
}
.timeline-content>p>span>i {
  padding-left:5px;
}
/* .timeline-content p:last-child {
  margin-bottom: 0;
} */

/*----- TIMELINE PERIOD -----*/
.period {
  padding: 0;
}

.period .timeline-marker:before {
  background: transparent;
  content: "";
  width: 15px;
  height: auto;
  border: none;
  border-radius: 0;
  top: 0;
  bottom: 30px;
  position: absolute;
  border-top:2px solid #cacaca;
}
.period .timeline-marker:after {
  content: "";
  height: 32px;
  top: auto;
}
.period .timeline-content {
  padding: 40px 0 70px;
}
.period .timeline-title {
  margin: 0;
}

/*----------------------------------------------
    MOD: TIMELINE SPLIT
----------------------------------------------*/
@media (min-width: 768px) {
  .timeline-split .timeline, .timeline-centered .timeline {
    display: table;
  }
  .timeline-split .timeline-item, .timeline-centered .timeline-item {
    display: table-row;
    padding: 0;
  }


.timeline-split .timeline-marker,
.timeline-centered .timeline-marker,
.timeline-split .timeline-content,
.timeline-centered .timeline-content {
    display: table-cell;
    vertical-align: top;
  }
  .timeline-split .timeline-marker, .timeline-centered .timeline-marker {
    position: relative;
  }
  .timeline-split .timeline-content, .timeline-centered .timeline-content {
    padding-left: 30px;
  }
  .timeline-split .period .timeline-title, .timeline-centered .period .timeline-title {
    position: relative;
    left: -45px;
  }
}

/*----------------------------------------------
    MOD: TIMELINE CENTERED
----------------------------------------------*/
@media (min-width: 992px) {
  .timeline-centered,
  .timeline-centered .timeline-item,
  .timeline-centered .timeline-marker,
  .timeline-centered .timeline-content {
    display: block;
    margin: 0;
    padding: 0;
  }
  .timeline-item::after {
    content:'';
    display:block;
    clear:both;
  }
  .timeline-centered .timeline-item:not(.period) {
    padding-bottom:50px;
  }
  .timeline-centered .timeline-marker {
    position: absolute;
    left: 50%;
    margin-left: -7.5px;
  }

  .timeline-centered .timeline-content {
    width: 50%;
  }



  /* PC용 */
  .timeline-centered > .timeline-item:nth-child(even) .timeline-content {
    float: left;
    text-align: right;
    padding-right: 30px;
  }
 
  .timeline-centered > .timeline-item:nth-child(even) p::after {
    content:'';
    display:block;
    clear:both;
  }
   /* PC용 */
  .timeline-centered > .timeline-item:nth-child(even) p>span {
    float:right;
  }
  .timeline-centered > .timeline-item:nth-child(odd) .timeline-content {
    float: right;
    text-align:left;
    /* padding-right: 30px; */
    padding-left: 30px;
    /* padding-top:40px; */
  }
  .timeline-centered > .timeline-item.period .timeline-content {
    float: none;
    padding: 0;
    width: 100%;
    text-align: center;
  }
  /* .timeline-centered .timeline-item.period {
    padding: 50px 0 90px;
  } */
  .timeline-centered .period .timeline-marker:after {
    height: 30px;
    bottom: 0;
    top: auto;
  }
  .timeline-centered .period .timeline-title {
    left: auto;
  }
} 

/*----------------------------------------------
    MOD: MARKER OUTLINE
----------------------------------------------*/
.marker-outline .timeline-marker:before {
  background: transparent;
  border-color: #f68b1d;
}
.marker-outline .timeline-item:hover .timeline-marker:before {
  background: #f68b1d;
}



/* sub1 특허 및 인증서 */
.patent {
  padding-top:75px;
  margin:0 auto;
  width:80%;
}
.patent>ul {
  display:flex;
  flex-direction:column;
  align-content:center;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
}
.patent>ul>li {
  display:flex;
  gap:58px;
}
.patent>ul>li:nth-child(n+2) {
  padding-top:107px
}
.patent li>div>div {
   box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
   border-top:1px solid #efefef;
   width:300px;
}
.patent li>div>div>img {
  width:100%;
}
.patent li p {
  padding-top:24px;
  text-align:center;
  font-size:20px;
}


/* sub1 조직구성 */
.organization {
  padding-top:75px;
  text-align:center;
  max-width:1144px;
  margin:0 auto;
}
.organization>img {
  width:80%;
}
.organization>img.mo {
  display:none;
}


/* sub1 오시는 길 */
.map_location {
  padding-top:75px;
}
.map_location .map_box {
  background-color:#f68b1d;
  line-height:1.8;
  position:relative;
}
.map_location .map_box dl {
  color:#fff;
  width:440px;
  width:auto;
  box-sizing:border-box;
}
.map_location .map_box dt {
  font-size:0;
  font-weight:600;
  margin-bottom:16px;
  width:37px;
  height:39px;
  display:block;
}
.map_location dt img {
  width:100%;
}
.map_location .map_box dd {
  font-size:20px;
  padding-top:0px;
}
.map_location .map_box dl {
  padding:45px 0 0 0;
}
.map_location .map_box dl:nth-child(1) {
  padding-top:50px;
}


.map_location .map_con {
  /* position:absolute; */
  position:static;
  top:0;left:40%;width:60%;height:100%;box-sizing: 
  border-box;background-color: #fff;
}
.map_location .map_contxt {
  position:absolute;
  /* position:static; */
  top:0;
  left:60%;
  width:40%;
  height:100%;
  box-sizing:border-box;
  background-color:transparent;
  padding-left:48px;
  padding-right:48px;
}
.map_location .map_box,
.map_location .map_con,
.map_location #map {
  height:550px;
}
.map_location .map_box .number {
  line-height:1.2;
}
.map_location .map_box .address dd {
  line-height:1.6;
}
.map_location .map_box .phone dt {
  background:none;
}
.eng .map_location .map_box .address dd br:nth-child(2) {
  display:none;
}


/* 오시는 길 버튼 설정 */
.map_location .go_seeking_btn {
  float:right;
  display:block;
  width:171px;
  background-color:#fff;
  color:#f68b1d;
  border-radius:10px;
  position:relative;
  padding:13px 35px;
  font-size:20px;
  margin-top:22px;
}
.eng .map_location .map_box dl {
  padding:55px 0 0 0;
}
.eng .map_location .go_seeking_btn {
  position:absolute;
  right:48px;
  bottom:60px;
  padding:13px 15px;
  font-size:16px;
}
/* 버튼 화살 애니메이션 */
.arrow {
  position:absolute;
  top:45%;
  top:50%;
  left:52%;
  transform:rotate(90deg);
  cursor:pointer;
  margin-top:2px;
}
.arrow span {
  display: block;
  /* width:.7vw;
  height:.7vw; */
  width:11px;
  height:11px;
  border-top:3px solid #f68b1d;
  border-left:3px solid #f68b1d;
  transform:rotate(45deg);
  margin:-10px;
  animation:animate 2s infinite;
}
.arrow span:nth-child(2) {
  animation-delay:.2s;
}
.arrow span:nth-child(3) {
  animation-delay:.4s;
}
.eng .arrow {
  top:54%;
  left:64%;
}
.eng .arrow span {
  width:8px;
  height:8px;
  border-top:2px solid #f68b1d;
  border-left:2px solid #f68b1d;
}

@keyframes animate {
  0% {
      opacity:0;
      transform:rotate(45deg) translate(-10px, -10px);
  }
  50% {
      opacity:1;
  }
  100% {
      opacity:0;
      transform:rotate(45deg) translate(-30px, -30px);
  }
}



/* sub2 이하 */
/* ai */
.bz_ai {
  padding-top:104px;
  padding-top:75px;
}

/* Tab CONTEENT */
/* ########################## */
.imagevideo-container {
  width: 50%;
  justify-content: center;
  position: relative;
  min-width: "500px";
}
.desc_tab_container {
  width: 100%;
  /* padding: 60px 60px 0px 60px; */
  display: flex;
  flex-direction: column;
  justify-content: center;
  /* text-align: left; */
}
.desc_tab_container>h4 {
  font-size:40px;
  font-size:28px;
  font-weight:600;
  line-height:1.2;
}
.desc_tab_container>h4>span:nth-child(1) {
  font-size:28px;
  font-size:22px;
}
.desc_tab_container>p {
  font-size:24px;
  font-weight:400;
  line-height:1.8;
  letter-spacing:-1px;
}
.tab_mySlides {
  display: flex;
}
.carousel_tab {
  position:relative;
  width: 100%;
  height:100%;
  overflow: hidden;
  display:flex;
  flex-direction: column-reverse;
  flex-direction:column;
  padding-left:58px; 
}
.desc_tab_container {
  margin-top:46px;
  padding-left:23px;
  padding-right:23px;
}
.desc_tab_container>p {
  margin-top:28px;
  font-size:20px;
}
.carousel_tab::before {
  content: '';
  display:block;
  position: absolute;
  left:58px;
  top:0;
  width:100%;
  height:5px;
  background-color:#efeeec;
}
.carousel_tab_viewport {
  display: flex;
  width: 100%;
  height: fit-content;
  transition: transform 1.2s ease;
}
.carousel_tab_slide {
  flex: 0 0 100%;
  width: 100%;
  height:427px;
}
.carousel_tab_navigation {
  width:100%;
  display:flex;
  flex-direction:column;
  flex-wrap:nowrap;
  align-items:flex-start;
  position:absolute;
  bottom:0;
  z-index:1;
}
.containertab {
  width:100%;
  display: flex;
  /* margin: auto; */
  max-height:750px;
  height:fit-content;
}
.menupane {
  width:50%;
}
.carousel_tab_slide {
  opacity: 0;
  transition: all 1.2s ease-in-out;
  display:none;
}
.carousel_tab_slide.active_slide {
  opacity: 1;
  transition: all 1.2s ease-in-out;
  display:block;
}
.carousel_tab_background {
  background-color: var(--magicroyal);
  opacity: 1;
  position: absolute;
  z-index: -1;
  transition: opacity 0.5s ease-in-out;
}

.imagepanel {
  width: 50%;
  height:500px;
  /* height:100%; */
  position: relative;
}
.imagepanel img {
  width:100%;
  height:auto;
  transform:translateY(-8%);
}
.image_container { 
  display:none;
  margin:0 auto;
  width:100%;
  height:100%;
  height:500px;
  max-width:792px;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  overflow:hidden;
}


/* Style the buttons inside the tab */
.carousel_tab button {
  width:100%;
  text-align:left;
}
.carousel_tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 10px 23px;
  transition: background-color 0.3s ease;
  font-size:26px;
  min-width: max-content;
  background-color:#efeeec;
  vertical-align:middle;
}
.carousel_tab button:not(:first-child) {
  margin-top:4px;
}
.carousel_tab button>span {
  font-size:24px;
  font-size:20px;
}
/* Change background color of buttons on hover */
.carousel_tab button:hover {
  background-color:#ddd;
}

/* Create a blue indicator for the selected tab */
.carousel_tab button.active {
  background-color:#f68c1f;
  color: white;
  font-weight:500;
}

/* Content container */
.carousel_tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
}

/* sub2-2 휴먼로보틱스비즈니스 */
.bz_hrb {
  display:flex;
  flex-direction:column;
  align-items:center;
  padding-top:75px;
}
.system_hrb {
  display:flex;
  flex-direction:row;
   /* align-content:stretch; */
  flex-wrap:nowrap;
}
.system_hrb2 {
  max-width:1100px;
  margin:0 auto;
  text-align:center;
}
.system_hrb2>img {
  width:100%;
}
.system_hrb2>img.mo {
  display:none;
}
.system_hrb>li {
  width:360px;
  height:360px;
  border-radius:1000px;
  color:#fff;
  display:flex;
  flex-direction:column;
  justify-content:center;
  /* align-items:center; */
  text-align:center;
  position:relative;
  overflow:hidden;
  z-index:-2;
}
.system_hrb>li::after {
  content:'';
  display:block;
  width:800px;
  height:308px;
  position:absolute;
  top:30px;
  left:0;
  z-index:-1;
  rotate:-45deg;
}
.system_hrb>li:first-child:after {
  background-color:#212f40;
}
.system_hrb>li:last-child:after {
  background-color:#798391;
}
.system_hrb>li:first-child {
  background-color:#081e3b;
}
.system_hrb>li:last-child {
  background-color:#7c8797;
  margin-left:108px;
}
.system_hrb>li h4 {
  font-size:28px;
  font-weight:bold;
  line-height:1;
  padding-bottom:20px;
}
.system_hrb>li h4::after {
  content:'';
  display:block;
  width:1px;
  height:45px;
  background-color:#fff;
  margin-left:50%;
  transform:translateX(-50%);
  margin-top:15px;
}
.system_hrb>li>ul>li {
  font-weight:400;
  font-size:20px;
  line-height:1;
}
.system_hrb>li>ul>li:not(:first-child) {
  margin-top:15px;
}

.eng .system_hrb>li h4 {
  padding-bottom:10px;
}
.eng .system_hrb>li h4::after {
  margin-top:10px;
}
.eng  .system_hrb>li>ul>li {
  font-size:18px;
}


@media screen and (min-width:1366px) {

/* 
  .carousel_tab {
    display:flex;
    flex-direction: column-reverse;
    flex-direction:column;
    padding-left:78px;
    
  }
  .carousel_tab::before {
    content: '';
    display:block;
    position: absolute;
    left:78px;
    top:0;
    width:100%;
    height:5px;
    background-color:#efeeec;
  }
  .desc_tab_container {
    margin-top:76px;
    padding-left:23px;
    padding-right:23px;
  }
  .desc_tab_container>p {
    margin-top:28px;
    font-size:28px;
  } */


  /* sub2-2 휴먼로보틱스비즈니스 */




}




/* 2-3 */
/* .bz_dhb {
  margin:0 auto;
  width:100%;
} */
.bz_hrb>div {
  padding-top:85px;
}

.bz_dhb {
  padding-top:75px;
}
.wrap_dhb {
  position:relative;
  width:100%;
}
.dhb_img {
  width:42%;
  height:300px;
  overflow:hidden;
}
.dhb_img>img {
  width:100%;
  transform:translateY(-16%);
}
.wrap_dhb>.dhb_desc {
  width:58%;
  position:absolute;
  top:8px;
  right:0;
  padding-left:5%;
  font-size:20px;
  /* font-size:2vw; */
  line-height:2;
}
.wrap_logic {
  padding-top:142px;
  text-align:center;
}
.wrap_logic>img {
  width:80%;
  height:auto;
}

.eng .dhb_img {
  height:380px;
}


 /* sub3 이하 */
 .list_cooper {
  /* max-width:1500px; */
  width:100%;
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr;
  justify-items: center;
  justify-content:space-between;
  padding-top:75px;
  gap:10px;
  margin:0 auto;
  /* display: flex; */
  /* justify-content: center; */
  /* flex-wrap:wrap; */
 }
.list_cooper>span {
  display: block;
  /* flex:0 0 auto;
  gap:20px; */
  width:233px;
  width:203px;
  height:100px;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  position:relative;
  box-shadow: rgb(202, 202, 202) 0px 0px 0px 1px;
  background-size:161px;
 }
 .list_cooper>span:nth-child(n+7) {
  margin-top:20px;
 }
.list_cooper .lge         { background-image: url('/img/ban_lge.png');  }
.list_cooper .lginnotek   { background-image: url('/img/ban_lginnotek.png'); }
.list_cooper .kt          { background-image: url('/img/ban_kt.png'); background-size:50px; }
.list_cooper .idispowertel{ background-image: url('/img/ban_idispowertel.png'); }
.list_cooper .sktelecom   { background-image: url('/img/ban_sktelecom.png'); }
.list_cooper .uplus       { background-image: url('/img/ban_uplus.png'); }
.list_cooper .keti        { background-image: url('/img/ban_keti.png'); }
.list_cooper .etri        { background-image: url('/img/ban_etri.png'); }
.list_cooper .twens       { background-image: url('/img/ban_twens.png'); }
.list_cooper .nablecomm   { background-image: url('/img/ban_nablecomm.png'); }
.list_cooper .hansungsysco{ background-image: url('/img/ban_hansungsysco.png'); }
.list_cooper .sentry      { background-image: url('/img/ban_sentry.png'); }
.list_cooper .hubilon     { background-image: url('/img/ban_hubilon.png'); }
.list_cooper .hangisool   { background-image: url('/img/ban_hangisool.png'); }
.list_cooper .dot42       { background-image: url('/img/ban_42dot.png'); }
.list_cooper .autoever    { background-image: url('/img/ban_autoever.png'); }
.list_cooper .sdi         { background-image: url('/img/ban_sdi.png'); }
.list_cooper .list_null { visibility:hidden;}



/* sub4 이하 */
/* 
.business_box [class*='con'] { opacity: 0; transform: translateY(50px); transition: opacity 0.6s ease, transform 0.6s ease; }
.business_box [class*='con'].show { opacity: 1; transform: translateY(0); }
*/
.info_rec h4 {
    padding-top:75px;
    font-size:26px;
    font-weight:bold;
    line-height:57px;
    height:57px;
    padding-bottom:26px;
}
.info_rec h4:first-child {
  padding-top:75px;
}
.info_rec h4::before {
    content:'';
    display:inline-block;
    width:8px;
    height:57px;
    background-color:#f68b1d;
    vertical-align:top;
    margin-right:23px;
}
.rec_field_list {
    display:flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content:space-around;
    /* padding-bottom:30px; */
}
.rec_field_list>li {
    height:470px;
    width:30%;
    position:relative;
    display:flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
}
.field_name {
    width:250px;
    height:250px;
    border-radius:300px;
    position:relative;
}
.field_name>p {
    font-size:26px;
    line-height:1.3;
    color:#fff;
    text-align:center;
    margin-top:50px;
}
.rec_field_list>li:last-child .field_name>p {
    margin-top:24px;
}
.rec_field_list>li:first-child .field_name {
    background-color:#f68b1d;
}
.rec_field_list>li:nth-child(2) .field_name {
    background-color:#58a796;
}
.rec_field_list>li:last-child .field_name {
    background-color:#42a6c8;
}

.field_category {
  position:absolute;
  z-index:1;
  top:110px;
  display:flex;
  justify-content:center;
  /* left:50%; */
  background-color:#fff;
  border-radius:30px;
  width:100%;
  /* width:490px; */
  height:347px;
}

.rec_field_list>li:first-child .field_category {
  box-shadow: rgb(246, 139, 29) 0px 0px 0px 6px;
}
.rec_field_list>li:nth-child(2) .field_category {
  box-shadow: rgb(88, 167, 150) 0px 0px 0px 6px;
}
.rec_field_list>li:last-child .field_category {
  box-shadow: rgb(66, 166, 200) 0px 0px 0px 6px;
}
.field_category ul {
  display:flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
}
.field_category ul>li {
  font-size:20px;
  font-weight:400;
  text-align:center;
  line-height:1.35;
}
.field_category ul>li:not(:first-child) {
  margin-top:15px;
}
 .rec_nec {
  width:100%;
 }
 .rec_nec>img {
  width:100%;
 }
 .rec_nec>img.mo {
  display:none;
 }
.job_application {
  background-color:#efeeec;
  padding:42px 95px;
  height:330px;
  height:250px;
  display:flex;
  align-items:center;
}
.job_application>ul>li {
  font-size:20px;
  font-weight:400;
}
.job_application>ul>li:not(:first-child) {
  padding-top:14px;
}
.job_application>ul {
  display:flex;
  flex-direction: column;
}

.job2>ul {
  position:relative;
}
.job2>ul:last-child {
    padding-left:76px;
    margin-left:92px;
}
.job2>ul:last-child::before {
    content:'';
    display:block;
    width:1px;
    height:148px;
    background-color:#8d857d;
    position:absolute;
    left:0;
    top:50%;
    transform:translateY(-50%);
}
.wrap_btn {
    text-align:center;
    padding-top:83px;
}
.wrap_btn .linkbtnL {
    min-width:468px;
    font-size:24px;
    height:102px;
    color:#777777;
}


/* sub 4-2 */
.chart_benefit {
    padding-top:75px;
    width:100%;
    /* display:grid;
    grid-template-columns:1fr 1fr; */
    /* align-content:stretch; */
    text-align:right;
}
.chart_benefit>img {
  width:100%;
}
.chart_benefit>img.mo {
  display:none;
}
.chart_benefit>p {
  font-size:18px;
}



/* sub 4-3 */
.table_contact {
    padding:75px 150px 0;
    /* max-width:1000px; */
}
.table_contact ul {
    width:100%;
    border-right: 1px solid #c7c7c7;
}
.table_contact ul>li {
    display:flex;
    flex-direction:row;
}
/* .table_contact ul>li>div {

} */
.title_contact {
    width:25%;
    text-align:center;
    background-color:#f68c1f;
    color:#fff;
    font-size:18px;
}
select {
    appearance: none; /* 브라우저 기본 스타일 제거 */
    -webkit-appearance: none;
    -moz-appearance: none;
}
select:disabled {
  opacity: 0.5;
}
option {
    padding:4% 2%;
}
.select_opt {
    border:none;
    outline:none;
    width:100%;
    padding:0 2%;
    height:50px;
    line-height:50px;
}
.selectbox {
    width:75%;
    position:relative;
    border-left:1px solid #f68c1f;
}
.table_contact li:first-child .selectbox::after  {
    content: '\25BC'; /* 아래 화살표 기호 */
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    pointer-events: none;
    font-size: 14px;
    color:#f68c1f;
}

/* select 박스가 포커스될 때 스타일 */
/* select:focus {
    border-color: #ff5e5e;
    outline: none;
    box-shadow: 0 0 5px rgba(255, 94, 94, 0.5);
} */


.table_contact li:last-child .title_contact {
    border-bottom:1px solid #f68c1f
}
.table_contact li:first-child .title_contact {
    border-top:1px solid #f68c1f
}
.ask_area>.selectbox {
    border-bottom: 1px solid #c7c7c7;
    
}
.table_contact li:first-child .selectbox {
    border-top: 1px solid #c7c7c7;
}
/* .table_contact li:not(:last-child) {
    border-bottom: 1px solid #c7c7c7;
} */
 .table_contact li:not(:first-child) .title_contact {
    border-top: 1px solid #fff;
 }
.table_contact li:not(:last-child) .selectbox {
    border-bottom: 1px solid #c7c7c7;
}
.table_contact input[type="text"] {
    width:100%;
    border:none;
    outline:none;
    line-height:58px;
    padding:0 2%;
}
.table_contact input::placeholder {
    color:#c7c7c7;
}
.table_contact li:not(:last-child) {
    line-height:58px;
}
.table_contact textarea {
    width:100%;
    height:400px;
    resize:none;
    border:none;
    outline:none;
    padding:2%;

}
.ask_area .title_contact {
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.table_contact li>.selectbox:focus-within {
    outline:2px solid #f68c1f;
    outline-offset:-2px;
    transition:all 0.05s;
    /* visibility: hidden;  */
    /* height:100%; */
    /* height:57px; */
    /*height:calc(100% - 1px);*/
}
.selectbox label {
    position:absolute;
    display:none;
    letter-spacing:-.2px;
}
.group_btn {
    text-align: center;
    padding-top:70px;
}
.group_btn button {
    padding:.7vw 3vw;
    border-radius:.325rem;
    font-size:1vw;
}
.group_btn button:last-child {
    margin-left:.5rem;
}
.group_btn button[type="submit"] {
    background-color:#3d4349;
    color:#fff;
    border:2px solid #3d4349;
}
.group_btn button[type="reset"] {
    /* background-color:#798391; */
    color:#798391;
    border:2px solid #798391;
    background-color:#fff;
}



/* 서브 반응형 */

@media (max-width: 1800px) {

} 




@media screen and (min-width:1100px) {


  
}






@media (max-width: 1600px) {
  
  /* sub2-3 */
  /* .wrap_dhb>.dhb_desc {
    font-size:1.9vw;
  } */
  
}


@media (max-width: 1500px) {
  
  /* common sub */
  .sub_inner {
    padding-left: 5%;
    padding-right: 5%;
  }
  .sub_inner h3 strong {
    font-size:32px;
  }
  .sub_headline {
    font-size:24px;
  }
  .sub_headline span {
    font-size:30px;
  }
  .sub_headline>p:nth-child(2) {
    font-size:20px;
  }
  .sub_headline>p:nth-child(2)>span {
    font-size:24px;
  }

  /* sub1-1 */
  .greet_title {
    height:240px;
  }
  .greeting svg {
    width:240px;
  }
  .greet_title>.greet_icon {
    width:90%;
    left:50%;
    transform:translate(-50%, -50%);
  }
  .greet_icon>img {
    width:50%;
  }
  .greet_icon>p {
    font-size:21px;
  }
  .greet_explain>p>strong {
    font-size:1.8vw;
  }
  .greet_explain>p:nth-child(2) {
    font-size:1.32vw;
  }


  /* sub1-2 */
  /* .vis_visual img {
    width:80%;
  }
  .vision_list>li {
    width:30%;
  }
  .vision_name>p:first-child {
    font-size:36px;
  }
  .vision_name>p:last-child {
    font-size:32px;
  }
  .vision_category p {
    font-size:28px;
  } */


  /* sub1-3 */
  /* .timeline h5 */

  /* sub1-4 */
  .patent>ul>li {
    width:300px;
    flex-direction:row;
    flex-wrap:nowrap;
    align-content:center;
    justify-content:center;
  }
  .patent>ul>li img {
    width:100%;
  }
  .patent>ul>li:nth-child(n+2) {
    padding-top:107px
  }
  .patent li>div>div {
    width:300px;
  }
  .patent li p {
    font-size:20px;
  }

  /* sub1-6 오시는 길 */
  .map_location .map_box,
  .map_location .map_con,
  .map_location #map {
    height:500px;
  }
  .map_location .map_box dl {
    padding:35px 0 0 0;
  }
  .map_location .map_box dt {
    width:34px;
    height:auto;
  }
  .map_location .map_box dd {
    font-size:18px;
  }
  .map_location .go_seeking_btn {
    width:161px;
    padding:12px 30px;
    font-size:18px;
  }

  /* 2-1 사업영역 */
  /* Tab CONTEENT */
  /* ########################## */
  .carousel_tab {
    padding-left:48px;
  }
  .carousel_tab::before {
    left:48px;
  }

  /* Style the buttons inside the tab */
  .carousel_tab button {
    width:100%;
    text-align:left;
    font-size:24px;
  }
  .carousel_tab button>span {
    font-size:16px;
  }
  .desc_tab_container>p {
    margin-top:28px;
    font-size:18px;
  }

  /* sub2-3 */
  .wrap_dhb>.dhb_desc {
    font-size:18px;
  }
  
  

  


  /* sub3 이하 */
  .list_cooper>span {
    width:233px;
    width:183px;
    height:80px;
    background-size:80%;
  }

  /* sub4-3 */
  .table_contact {
    padding-left:100px;
    padding-right:100px;
  }
  .group_btn button {
    padding:.8vw 4vw;
    padding:12px 57px;
    border-radius:.325rem;
    font-size:18px;
  }

  /* 서브 영문 1-3 */
  .eng .map_location .map_box dl {
    padding:35px 0 0 0;
  }
  .eng .map_location .go_seeking_btn {
    bottom:35px;
    /* width:151px;
    padding:12px 30px 12px 25px; */
  }

}




@media (max-width: 1400px) {

  /* 서브 공통 */
  .subheader-visual {
    height:247px;
  }
   
  


  /* 2-1 사업영역 */
  /* Tab CONTEENT */
  /* ########################## */
  .desc_tab_container {
    margin-top:40px;
  }


  /* sub2-2 휴먼로보틱스비즈니스 */

.system_hrb>li {
  width:300px;
  height:300px;
}
.system_hrb>li::after {
  top:-30px;
}

.system_hrb>li:last-child {
  margin-left:68px;
}
.system_hrb>li h4 {
  font-size:24px;
  font-weight:bold;
  line-height:1;
  padding-bottom:10px;
}
.system_hrb>li h4::after {
  height:35px;
  margin-top:10px;
}
.system_hrb>li>ul>li {
  font-size:16px;
}
.system_hrb2>img {
  width:80%;
}




  /* sub4-1 이하 */
  .info_rec h4 {
    font-size:26px;
    line-height:57px;
    height:57px;
  }
  .info_rec h4::before {
    width:8px;
    height:57px;
    margin-right:20px;
  }
  .rec_field_list>li {
    height:460px;
  }
  .field_name {
    width:220px;
    height:220px;
  }
  .field_name>p {
    font-size:24px;
  }
  .rec_field_list>li:first-child .field_category {
    box-shadow: rgb(246, 139, 29) 0px 0px 0px 6px;
  }
  .rec_field_list>li:nth-child(2) .field_category {
    box-shadow: rgb(88, 167, 150) 0px 0px 0px 6px;
  }
  .rec_field_list>li:last-child .field_category {
    box-shadow: rgb(66, 166, 200) 0px 0px 0px 6px;
  }

  .field_category ul>li {
    font-size:18px;
    line-height:1.3;
  }
  .field_category ul>li:not(:first-child) {
    margin-top:15px;
  }
  .job_application>ul>li {
    font-size:18px;
  }
  .job2>ul:last-child::before {
    height:138px;
  }
  .job_application {
    height:220px;
  }
  .wrap_btn .linkbtnL {
    min-width:408px;
    font-size:22px;
    height:82px;
  }

  /* sub4-2 */
  .chart_benefit>p {
    font-size:16px;
  }

  /* sub4-3 */
  .timeline h5 {
    font-size:28px;
  }
  .timeline-content p {
    font-size:18px;
  }

  /* 영문 서브 2-2 */
  .eng .system_hrb>li h4 {
    padding-bottom:5px;
  }
  .eng .system_hrb>li h4::after {
    margin-top:5px;
  }
  .eng  .system_hrb>li>ul>li {
    font-size:15px;
  }

}





@media (max-width: 1350px) {



}


@media (max-width: 1300px) {

  
   /* .greet_explain {
    width:80%;
  } */
   /* sub1-1 */
  .greet_title {
    height:220px;
  }
  .greeting svg {
    width:220px;
  }
  .greet_title>.greet_icon {
    width:80%;
    left:50%;
    transform:translate(-50%, -50%);
  }
  .greet_icon>img {
    width:60%;
  }
  .greet_icon>p {
    font-size:18px;
  }

  /* sub1-2 */
  .vision_list>li {
    height:345px;
  }
  .vision_list>li:first-child .vision_category {
    box-shadow: rgb(246, 139, 29) 0px 0px 0px 4px;
  }
  .vision_list>li:nth-child(2) .vision_category {
    box-shadow: rgb(88, 167, 150) 0px 0px 0px 4px;
  }
  .vision_list>li:last-child .vision_category {
    box-shadow: rgb(66, 166, 200) 0px 0px 0px 4px;
  }
  .vision_name {
    width:170px;
    height:170px;
  }
  .vision_name>p:first-child {
    font-size:26px;
  }
  .vision_name>p:last-child {
    font-size:20px;
  }
  .vision_category {  
    height:250px;
    top:91px;
  }
  .vision_category p {
    font-size:18px;
    /* margin-top:32px;  */
    margin-top:68px;
  }

  /* sub1-6 오시는 길 */
  .map_location .map_box dd {
    font-size:16px;
  }
  /* .eng .map_location .map_box dl:nth-child(1) {
    padding-top:55px;
  } */
  /* .eng .map_location .map_box .address dd br:nth-child(2), */
  .map_location .map_box .address dd br:nth-child(1) {
    display:block;
  }
  .eng .map_location .go_seeking_btn {
    bottom:45px;
    /* right:35px; */
  }
  
  /* sub2-1 */
  .desc_tab_container>h4>span:nth-child(1) {
    font-size:20px;
  }




  /* sub3 이하 */
  .list_cooper>span {
    width:163px;
    height:65px;
    background-size:80%;
  }
  .list_cooper>span:nth-child(n+7) {
    margin-top:0px;
  }

  


  /* 서브 영문 1-2 */
  .eng .vision_name>p:first-child {
    font-size:26px;
  }
  .eng .vision_name>p:last-child {
    font-size:20px;
  }


  
}



@media (max-width: 1250px) {

  /* 영문 서브 2-3 */
   .eng .dhb_img>img {
    width:auto;
    height:100%;
    transform: translateY(0);
  }

}

@media (max-width: 1200px) {

   /* .greet_explain {
    width:80%;
  } */
  .greet_title {
    height:200px;
  }
  .greeting svg {
    width:200px;
  }
  /* .greet_title>.greet_icon {
    width:80%;
    left:50%;
    transform:translate(-50%, -50%);
  }
  .greet_icon>img {
    width:60%;
  }
  .greet_icon>p {
    font-size:18px;
  } */
  .greet_explain>p:nth-child(2) {
    padding-top:10px;
  }
  .sign_ceo {
    font-size:14px;
  }

  /* sub1-6 오시는 길 */
  /* .map_location .map_box dd {
    font-size:18px;
  } */



   /* 2-1 사업영역 */
  /* Tab CONTEENT */
  /* ########################## */
  .containertab {
    flex-direction:column;
    max-height:none;
  }
  .imagepanel,
  .menupane {
    width:100%;
  }
  .imagepanel {
    width:100%;
    height:450px;
  }
  .image_container {
    max-width:none;
    height:450px;
    overflow:hidden;
  }
  .image_container img {
    width:100%;
    height:auto;
    transform:translateY(-22%);
  }
  .carousel_tab {
    padding-left:0px;
    flex-direction:column-reverse;
  }
  /* Style the buttons inside the tab */
  .desc_tab_container {
    margin-top:0px;
    padding-top:40px;
    padding-bottom:40px;
  }
  .carousel_tab::before {
    display:none;
  }
  .carousel_tab_navigation {
    z-index:1;
    position: relative;
  }
  .carousel_tab_slide {
    height:auto;
  }

  /* sub2-2 휴먼로보틱스비즈니스 */
  .system_hrb>li {
    width:320px;
    height:320px;
   }
  .system_hrb>li::after {
    top:15px;
  }
  .system_hrb>li:last-child {
    margin-left:84px;
  }
  .system_hrb>li h4 {
    font-size:26px;
  }
  .system_hrb>li>ul>li {
    font-size:18px;
  }

  /* sub3 이하 */
  .list_cooper>span {
    width:153px;
    height:58px;
    background-size:80%;
  }

  /* sub4-2 */
  .chart_benefit>p {
    font-size:14px;
  }

  /* 서브 영문 2-1 */
  .eng.company .sub_inner>.greeting {
    padding-left:100px;
    padding-right:100px;
  }

   
}



@media (max-width: 1150px) {

  /* sub1-2 */
  /* .sub_headline>p:nth-child(2) {
    font-size:20px;
  }
  .sub_headline>p:nth-child(2)>span {
    font-size:22px;
  } */
  .vision_list>li {
    height:325px;
  }
  .vision_list>li:first-child .vision_category {
    box-shadow: rgb(246, 139, 29) 0px 0px 0px 4px;
  }
  .vision_list>li:nth-child(2) .vision_category {
    box-shadow: rgb(88, 167, 150) 0px 0px 0px 4px;
  }
  .vision_list>li:last-child .vision_category {
    box-shadow: rgb(66, 166, 200) 0px 0px 0px 4px;
  }
  .vision_name {
    width:150px;
    height:150px;
  }
  .vision_name>p:first-child {
    font-size:24px;
  }
  .vision_name>p:last-child {
    font-size:18px;
  }
  .vision_category {  
    height:230px;
    top:81px;
  }
  .vision_category p {
    font-size:16px;
    /* margin-top:32px;  */
    margin-top:68px;
  }


  /* sub4-1 이하 */
  .info_rec h4 {
    font-size:22px;
    line-height:47px;
    height:47px;
    padding-top:120px;
    padding-bottom:46px;
  }
  .info_rec h4::before {
    width:6px;
    height:47px;
    margin-right:18px;
  }
  .rec_field_list>li {
    height:420px;
  }
  .field_name {
    width:180px;
    height:180px;
  }
  .field_name>p {
    font-size:22px;
    margin-top:40px;
  }
  .rec_field_list>li:last-child .field_name>p {
    margin-top:18px;
  }
  .field_category {
    top:90px;
    height:327px;
  }
  .field_category ul>li {
    font-size:16px;
    line-height:1.3;
  }
  .job_application {
    padding:32px 65px;
  }
  .job_application>ul>li {
    font-size:16px;
  }
  .job2>ul:last-child::before {
    height:118px;
  }
  .job_application {
    height:200px;
  }
  .wrap_btn .linkbtnL {
    min-width:368px;
    font-size:20px;
    height:72px;
  }

  /* 서브 영문 1-2 */
  .eng .vision_name>p:first-child {
    font-size:24px;
  }
  .eng .vision_name>p:last-child {
    font-size:18px;
  }


}

@media (max-width: 1100px) {
  .sub_headline {
    padding-top:45px;
  }
  

  /* sub1-6 오시는 길 */
  /* .map_location .map_box dl {
    padding:45px 0 0 0;
    padding-top:40px !important;
  } */
  
  .map_location .map_box .address dd br:nth-child(1) {
    display:none;
  }
  .map_location .map_box .address dd br:nth-child(2) {
    display:block;
  }
  .map_location {
    padding-top:104px;
    padding-top:75px;
  }
  .map_location .map_box {
    background-color:#f68b1d;
    line-height:1.8;
    position:relative;
    display: flex;
    flex-direction: column;
    height: auto;
  }
  /* .map_location .map_box dl {
    color:#fff;
    width:440px;
    box-sizing:border-box;
  } */
   .map_location .map_box dl {
    padding:45px 0 0 0;
    padding-top:30px !important;
    align-items:center;
    display:flex;
    flex-direction:row;
    gap:10px;
    gap:0;
    vertical-align:middle;
  }
  .map_location .map_box dl:first-child {
    padding-top:10px !important;
  }
  .map_location dl dd {
    vertical-align:middle;
  }
  .map_location .map_box dt {
    font-size:0;
    font-weight:600;
    margin-bottom:0;
    height:32px;
    display:block;
    padding:5px 24px 5px 0;
    /* margin-bottom:50%; */
    /* transform:translateY(10%); */
  }
  .map_location dt img {
    height:100%;
    width:auto;
  }
  .map_location .map_box dd {
    height:auto;
  }
  .map_location .map_con {
    position:static;
    top:0;
    left:0%;
    width:100%;
    height:100%;
    box-sizing:border-box;
    background-color:#fff;
  }
  .map_location .map_contxt {
    position:relative;
    top:0;
    left:0%;
    width:100%;
    height:100%;
    box-sizing:border-box;
    background-color:#f68b1d;
    display:flex;
    flex-direction:column;
    justify-content:space-evenly;
    padding:40px 60px;
  }
  .map_location .map_box {
    height:auto;
  }
  .map_location #map,
  .map_location .map_con {
    height:500px;
  }
  /* .map_location .map_box dd {
    font-size:22px;
  } */
  .map_location .map_box dd {
    line-height:1.6;
  }
  .map_location .go_seeking_btn {
    position:absolute;
    padding:13px 30px;
    margin-top:0;
    right:60px;
    bottom:35px;
  }
  .eng .map_location .go_seeking_btn {
    bottom:32px;
  }
  

  /* sub2-3 */
  .wrap_dhb>.dhb_desc {
    top:3px;
    font-size:17px;
  }

  /* sub3 이하 */
  .list_cooper {
    grid-template-columns:1fr 1fr 1fr 1fr 1fr;
  }



}

@media (max-width: 1000px) {

  /* sub common */
  .sub-nav>ul {
    flex-direction:row;
    flex-wrap:wrap;
  }
  .sub-nav.sub1>ul>li {
    width:33.333%;
  }

  /* sub1-1 */
   /* .greet_explain {
    width:80%;
  } */
  .greet_title {
    height:200px;
  }
  .greeting svg {
    width:200px;
  }
  /* .greet_title>.greet_icon {
    width:80%;
    left:50%;
    transform:translate(-50%, -50%);
  }
  .greet_icon>img {
    width:60%;
  }
  .greet_icon>p {
    font-size:18px;
  } */
  .greet_explain>p:nth-child(2) {
    padding-top:10px;
  }


  /* sub1-2 */
  .sub_headline>p:nth-child(2) {
    font-size:20px;
  }
  .sub_headline>p:nth-child(2)>span {
    font-size:22px;
  }
  
  /* sub1-3 */
  .timeline-content>p>span>i {
    display:none;
  }

  /* sub1-4 */
  .patent>ul>li {
    gap:30px;
    width:280px;
  }
  /* .patent>ul>li img {
    width:100%;
  } */
  /* .patent>ul>li:nth-child(n+2) {
    padding-top:107px
  } */
  .patent li>div>div {
    width:280px;
  }
  .patent li p {
    font-size:18px;
  }


  /* sub1-6 */
  /* .map_location .map_box dt {
    transform:translateY(10%);
  } */


  /* sub4-1 이하 */
  .info_rec h4 {
    font-size:20px;
    line-height:37px;
    height:37px;
  }
  .info_rec h4::before {
    width:5px;
    height:37px;
    margin-right:15px;
  }
  .rec_field_list>li {
    height:420px;
  }
  .field_name {
    width:180px;
    height:180px;
  }
  .field_name>p {
    font-size:20px;
    margin-top:40px;
  }
  .rec_field_list>li:last-child .field_name>p {
    margin-top:18px;
  }
  .field_category {
    height:327px;
  }
  .rec_field_list>li:nth-child(3) li:nth-child(3),
  .rec_field_list>li:nth-child(2) li:first-child {
    padding:0 12%;
  }
  .job_application {
    padding:32px 65px;
  }
  .job_application>ul>li {
    font-size:16px;
  }
  .job2>ul:last-child::before {
    height:118px;
  }
  .job_application {
    height:200px;
  }
  .wrap_btn .linkbtnL {
    min-width:368px;
    font-size:20px;
    height:72px;
  }

  

}


@media (max-width: 980px) {

  /* sub2-3 */
  .dhb_img {
    width:100%;
    height:400px;
  }
  .wrap_dhb>.dhb_desc {
    width:100%;
    position: absolute;
    position:relative;
    position:static;
    top: 0;
    right: 0;
    padding-left:1.25%;
    padding-right:1.25%;
    padding-top:20px;
    line-height: 2;
  }
  .wrap_logic {
    padding-top:82px;
  }

  /* 영문 서브 2-3 */
  /* .eng .dhb_img {
    height:480px;
  } */
   .eng .dhb_img>img {
    width:100%;
    height:auto;
    transform: translateY(-16%);
  }


}



@media (max-width: 900px) {
  .subheader-visual {
    height:207px;
  }
  .subheader-visual>h2 {
    font-size:24px;
  }
  .sub_inner h3 strong {
    font-size:30px;
  }
  .sub_headline {
    text-align:center;
    font-size:26px;
    width:80%;
    margin:0 auto;
  }
  .sub_headline span {
    font-size:34px;
  }
  .greeting {
    flex-direction:column;
    align-items:center;
  }
  .sub_inner>.greeting:not(:nth-child(3)) {
    padding-top:80px;
  }
   .greet_explain {
    text-align:center;
    padding-left:0;
    padding-top:20px;
  }
  .greet_title {
    height:200px;
    width:fit-content;
  }
  .greeting svg {
    width:200px;
  }
  .greet_title>.greet_icon {
    width:90%;
    /* left: 50%;
    transform: translate(-50%, -50%); */
  }
  .greet_icon>img {
    width:50%;
  }
  .greet_icon>p {
    font-size:18px;
  }
  .greet_explain>p:nth-child(2) {
    padding-top:10px;
  }
  .greet_explain>p>strong {
    font-size:27px;
  }
  .greet_explain>p>strong>i {
    display:block;
  }
  .greet_explain>p>strong>br {
    display:block;
  }
  .greet_explain>p:nth-child(2) {
    font-size:18px;
  }
  .sign_ceo {
    padding-top:30px;
  }



  /* sub1-2 */
  .vis_visual img {
    width:60%;
  }
  
  .vision_list {
    flex-direction:column;
    align-items:center;
  }
  .vision_list>li {
    width:80%;
    height:180px;
    justify-content:center;
    align-items:flex-start;
  }
  .vision_list>li:not(:first-child) {
    margin-top:40px;
  }
  .vision_name {
    width:150px;
    height:150px;
  }
  .vision_category {
    top:0;
    right:0;
    width:82%;
    height:180px;
  }
  .vision_category>p>br:nth-child(odd) {
    display:none;
  }
  .vision_name>p:first-child {
    font-size:26px;
  }
  .vision_name>p:last-child {
    font-size:22px;
  }
  .vision_category p {
    font-size:20px;
    margin-top:0;
  }

  /* sub1-4 */
  .patent>ul>li {
    /* gap:30px; */
    width:240px;
  }

  .patent li>div>div {
    width:240px;
  }


  /* sub1-6 */
  /* sub2-1 */
  .sub-nav.sub2>ul>li {
    width:100%;
  }

  /* sub2-2 휴먼로보틱스비즈니스 */
  .system_hrb>li:last-child {
    margin-left:64px;
  }

  /* sub3 이하 */
  .list_cooper>span {
    width:133px;
    height:48px;
  }


  /* sub4-1 이하 */
  .info_rec h4 {
    font-size:20px;
    line-height:37px;
    height:37px;
  }
  .info_rec h4::before {
    width:5px;
    height:37px;
    margin-right:15px;
  }
  .rec_field_list {
    display: flex;
    flex-direction: column;
    /* padding-bottom: 30px; */
    flex-wrap: wrap;
}
  .rec_field_list>li {
    height:360px;
    width:100%;
  }
  .rec_field_list>li:not(:first-child) {
    margin-top:30px;
  }
  .field_name {
    width:180px;
    height:180px;
  }
  .field_name>p {
    font-size:20px;
    margin-top:40px;
  }
  .rec_field_list>li:last-child .field_name>p {
    margin-top:18px;
  }
  .field_category {
    left:50%;
    /* top:0; */
    width:80%;
    height:260px;
    transform:translateX(-50%);
  }
  .field_category ul>li>br {
    display:none;
  }
  .rec_field_list>li:nth-child(3) li:nth-child(3),
  .rec_field_list>li:nth-child(2) li:first-child {
    padding:0 12%;
    padding:0;
  }
  .job_application {
    padding:32px 35px;
  }
  .job2>ul:last-child {
    padding-left:46px;
    margin-left:62px;
  }
  .job2>ul:last-child::before {
    height:118px;
  }
  .job_application {
    height:auto;
  }
  .job_application.job2 {
    flex-direction:column;
    align-items:flex-start;
    height:auto;
  }
  .job2>ul {
    width:100%;
  }
  .job2>ul:last-child {
    padding-left:0;
    margin-left:0;
    margin-top:30px;
    padding-top:30px;
  }
  .job2>ul:last-child::before {
    /* display:none; */
    width:100%;
    height:1px;
    top:0;
    transform:none;
  }
  .wrap_btn .linkbtnL {
    min-width:368px;
    font-size:20px;
    height:72px;
  }

  /* 서브 영문 2-1 */
  .eng.company .sub_inner>.greeting {
    padding-left:0;
    padding-right:0;
  }

  /* 서브 영문 1-2 */
  .eng .vision_category>p>br:nth-child(odd) {
    display:block;
  }

  /* 서브 영문 1-3 */
  .eng .map_location .map_box dd {
    font-size:16px;
  }

}




@media (max-width: 800px) {
  .sub_inner {
    padding-left:2.5%;
    padding-right:2.5%;
  }
  /* sub1-6 */
  

  /* sub2-2 휴먼로보틱스비즈니스 */
  .system_hrb>li {
    width:320px;
    height:320px;
   }
  .system_hrb>li::after {
    top:-15px;
  }
  .system_hrb>li:last-child {
    margin-left:20px;
  }
  .system_hrb>li h4 {
    font-size:24px;
  }
  .system_hrb>li h4::after {
    height:35px;
  }
  .system_hrb>li>ul>li {
    font-size:17px;
    line-height:.8;
  }

  /* sub3 이하 */
  .list_cooper>span {
    width:123px;
    height:48px;
  }

  /* sub4-2 */
  .chart_benefit>img.pc {
    display:none;
  }
  .chart_benefit>img.mo {
    display:block;
  }

}


@media (max-width: 780px) {

  /* sub1-2 */
  .vis_visual img {
    width:90%;
  }
  .timeline-item {
    padding-left:30px;
  }
  

  .table_contact {
    padding-left:25px;
    padding-right:25px;
  }
  .table_contact ul>li {
    display: flex;
    flex-direction: column;
  }
  .table_contact li {
    line-height:58px;
  }
  .title_contact {
    width:100%;
    text-align:left;
    padding-left:10px;
  }
  .selectbox {
    width:100%;
    border-left: 1px solid #c7c7c7;
  }

  /* sub4-2 */
  .chart_benefit>p {
    font-size:12px;
    padding-top:6px;
  }

  /* 서브 영문 1-3 */
  .map_location .map_box .address dd br:nth-child(1) {
    display:block;
  }

  

}

@media (max-width: 700px) {

  /* sub1-2 */
  .vision_category p {
    font-size:18px;
  }
  .vision_category>p>br:nth-child(odd) {
    display:block;
  }
  

  /* sub1-4 */
  .patent>ul>li {
    gap:30px;
    width:180px;
  }
  /* .patent>ul>li img {
    width:100%;
  } */
  /* .patent>ul>li:nth-child(n+2) {
    padding-top:107px
  } */
  .patent li>div>div {
    width:180px;
  }
  .patent li p {
    font-size:16px;
  }
  .patent>ul>li:nth-child(n+2) {
    padding-top:87px
  }
  .patent li p {
    padding-top:24px;
  }

  /* sub1-5 */
    .organization>img.pc {
      display:none;
    }
    .organization>img.mo {
      display:block;
      width:100%;
    }

  /* sub2-1 */
  .imagepanel,
  .image_container {
    height:400px;
  }
  /*
  .image_container img {
    width: 100%;
    height: auto;
    transform:none;
  } */

  /* sub2-2 휴먼로보틱스비즈니스 */
  .system_hrb {
    flex-direction:column;
  }
  .system_hrb>li {
    width:280px;
    height:280px;
   }
  .system_hrb>li::after {
    top:15px;
  }
  .system_hrb>li:last-child {
    margin-left:0;
    margin-top:20px;
  }
  .system_hrb>li h4 {
    font-size:22px;
    padding-bottom:15px;
  }
  .system_hrb>li h4::after {
    height:35px;
    margin-top:15px;
  }
  .system_hrb>li>ul>li {
    font-size:16px;
    line-height:.6;
  }
  .system_hrb2>img.pc {
    display:none;
  }
  .system_hrb2>img.mo {
    display:block;
    width:100%;
  }
  .wrap_logic>img {
    width:100%;
  }



  /* sub3-1 */
  .list_cooper>span {
    width:113px;
    height:46px;
  }

  /* sub4-1 */
  .rec_nec>img.pc {
    display:none;
  }
  .rec_nec>img.mo {
    display:block;
  }


  

}



@media (max-width: 650px) {

  .sign_ceo {
    font-size:12px;
  }

  /* sub3-1 */
  .list_cooper {
    grid-template-columns:1fr 1fr 1fr 1fr;
  }

  
}

@media (max-width: 600px) {
  /* .sub_inner {
    padding-left:2.5%;
    padding-right:2.5%;
  } */
  .sub-nav>ul>li>a {
    font-size:16px;
    line-height:60px;
  }
  .sub-nav>ul>li.active::after {
    height:8px;
    margin-top:-8px;
  }
  .sub_inner h3 strong {
    font-size:26px;
  }
  .sub_headline {
    font-size:18px;
    width:96%;
  }
  .sub_headline span {
    font-size:22px;
    line-height:1.3;
  }

  /* sub1-1 */
  .greet_explain>p>strong {
    font-size:20px;
  }
  .greet_explain>p>strong>i {
    display:block;
  }
  .greet_explain>p>strong>br {
    display:none;
  }
  .greet_explain>p:nth-child(2) {
    font-size:16px;
  }
  .sign_ceo {
    padding-top:30px;
  }



  


  /* sub1-2 */
  .sub_headline>p:nth-child(2) {
    font-size:18px;
  }
  .sub_headline>p:nth-child(2)>span {
    font-size:20px;
  }
   .vision_category p {
    margin-left:60px;
   }

    /* sub1-3 */
    .tab button {
      font-size:20px;
      width:150px;
      height:58px;
    }
    .timeline h5 {
      font-size:24px;
    }
    .timeline-content p {
      font-size:16px;
    }

    /* sub1-4 */
    .patent>ul>li {
      gap:10px;
    }

    


  /* sub1-6 */
  .map_location #map,
  .map_location .map_con {
    height:300px;
  }
  .map_location .map_contxt {
    padding:40px;
  }
  .map_location .go_seeking_btn {
    width:141px;
    font-size:16px;
    padding:11px 10px 11px 25px;
    right:30px;
  }
  
  .arrow span {
    width:10px;
    height:10px;
  }
  .eng .map_location .go_seeking_btn {
    font-size:14px;
    right:40px;
  }

  /* sub2-1 */
  .sub_headline span>i {
    font-size:16px;
  }

  



}



@media (max-width: 580px) {

  /* sub2-3 */
  .eng .dhb_img,
  .dhb_img {
    height:300px;
  }


}



@media (max-width: 550px) {
  /* sub1 공통 */
  /* .subheader-visual {
    height:286px;
  }
  .sub-nav.sub1>ul>li {
    width:50%;
  }
  .subheader-visual>h2 {
    font-size:22px;
  } */
  
  .sub_inner h3 strong {
    font-size:24px;
  }
  .sub_headline i {
    display:block;
  }

  .sub_inner>.greeting:not(:nth-child(3)) {
    padding-top:80px;
  }

  /* sub1-1 ceo인사말 */
   .greet_explain {
    text-align:center;
    padding-top:20px;
  }
  .greet_title {
    height:180px;
    width:fit-content;
  }
  .greeting svg {
    width:180px;
  }
  .greet_title>.greet_icon {
    width:90%;
    /* left: 50%;
    transform: translate(-50%, -50%); */
  }
  .greet_icon>img {
    width:50%;
  }
  .greet_icon>p {
    font-size:18px;
  }
  .greet_explain>p:nth-child(2) {
    padding-top:8px;
  }
  .greet_explain>p>strong {
    font-size:16px;
    line-height:1.45;
  }
  .greet_explain>p>strong>i,
  .greet_explain>p>strong>br {
    display:block;
  }
  .greet_explain>p:nth-child(2) {
    font-size:14px;
  }
  .sign_ceo {
    padding-top:30px;
  }

  /* sub1-2 */
  .vision_list {
    width:auto;
    margin:0 auto;
    padding-left:0;
    padding-right:0;
  }

  .vision_list>li {
    width:80%;
    height:300px;
    flex-direction:row;
    justify-content:center;
    align-items:flex-start;
  }

  .vision_name {
    width:140px;
    height:140px;
  }
  .vision_category {
    top:76px;
    right:0;
    width:100%;
    height:220px;
  }

  .vision_name>p:first-child {
    font-size:24px;
  }
  .vision_name>p:last-child {
    font-size:20px;
  }
  .vision_category p {
    font-size:16px;
    margin-top:60px;
    margin-left:0;
  }

   /* 서브 영문 1-2 */
  .eng.sub-nav.sub1>ul>li {
    width:100%;
  }
  .eng .vision_name>p:first-child {
    font-size:22px;
  }

}



@media (max-width: 520px) {
    /* sub3-1 */
  .list_cooper {
    grid-template-columns:1fr 1fr 1fr;
  }
  .list_cooper>span {
    width:103px;
    height:46px;
  }

  /* sub4-1 */
  .field_category ul>li>br {
    display:block;
  }



}


@media (max-width: 500px) {

  

  /* sub1-4 */
  .patent>ul>li {
    /* gap:30px; */
    width:120px;
  }
  .patent li>div>div {
    width:120px;
  }
  .patent li p {
    font-size:14px;
  }
  /* .patent>ul>li:nth-child(n+2) {
    padding-top:87px
  } */
  .patent li p {
    padding-top:18px;
  }


  /* sub1-6 */
  /* .map_location #map,
  .map_location .map_con {
    height:400px;
  } */
  .map_location .map_contxt {
    padding:40px 30px;
  }
  .map_location .map_box dt {
    padding-right:24px;
    width:25px;
  }
  .map_location .map_box dd {
    font-size:16px;
  }
  /* sub1-6 */
  .eng .map_location .go_seeking_btn {
    font-size:12px;
    right:30px;
  }
  .eng .arrow {
    top:58%;
    left:54%;
  }
  .eng .arrow span {
    width:6px;
    height:6px;
  }



  /* sub2-1 */
  .imagepanel,
  .image_container {
    height:300px;
  }
  .image_container>img {
    transform:translateY(-10%);
  }
          

  /* sub4-1 */
  .field_category ul>li,
  .job_application>ul>li {
    font-size:14px;
  }
  .wrap_btn .linkbtnL {
    min-width:288px;
    font-size:18px;
    height:62px;
  }

  /* sub4-3 */
  .group_btn button {
    padding:.8vw 4vw;
    padding:10px 37px;
    border-radius:.325rem;
    font-size:16px;
  }

}

@media (max-width: 480px) {

  
  

  /* sub2-1 */
  .desc_tab_container {
    /* padding-top:0; */
    padding-left:13px;
    padding-right:13px;
  }
  .desc_tab_container>h4 {
    font-size:22px;
  }
  .desc_tab_container>h4>span:nth-child(1) {
    font-size:16px;
  }
  .desc_tab_container>p {
    font-size:14px;
    margin-top:18px;
  }
  .carousel_tab button {
    font-size:20px;
    padding:10px 16px;
  }
  .carousel_tab button>span {
    font-size:16px;
  }


  /* sub2-2 */
  .system_hrb>li {
    width:250px;
    height:250px;
  }
  .system_hrb>li::after {
    top:-75px;
  }
  .system_hrb>li h4 {
    font-size:20px;
    padding-bottom:15px;
  }
  .system_hrb>li h4::after {
    margin-top:10px;
  }
  .system_hrb>li>ul>li {
    font-size:14px;
    font-size:1.5;
  }

  /* sub2-3 */
  .eng .dhb_img>img,
  .dhb_img>img {
    height:auto;
    width:156%;
    margin-left:50%;
    transform:translate(-50%, -20%);
  }
  .wrap_dhb>.dhb_desc {
    font-size:16px;
  }

  /* sub4-2 */
  .job_application {
    /* padding-left:20px;
    padding-right:20px; */
    padding-left:5%;
    padding-right:5%;
  }

  /* 영문 서브 2-2 */
  .eng .system_hrb>li h4 {
    font-size:18px;
    padding-bottom:8px;
  }
  .eng .system_hrb>li h4::after {
    margin-top:8px;
  }
  .eng  .system_hrb>li>ul>li {
    font-size:13px;
  }


}



@media (max-width: 460px) {

  /* sub1-6 */
  .map_location #map, .map_location .map_con {
    height:250px;
  }
  .map_location .map_box dl {
    padding-top:0px !important;
  }
  .map_location .map_box dl:first-child {
    padding-top:3px !important;
  }
  .map_location .map_box dl:nth-child(2) {
    padding-top:20px !important;
  }
  .map_location .map_box dl:nth-child(3) {
    padding-top:12px !important;
  }
  .map_location .map_contxt {
    padding:34px 30px 90px;
  }
  .map_location .map_box dt {
    padding-right:14px;
    height:25px;
    width:24px;
  }
  .map_location .map_box dd {
    font-size:14px;
  }
  .map_location .map_box .address dd br:nth-child(1) {
    display:block;
  }
  .map_location .go_seeking_btn {
    width:121px;
    font-size:14px;
    padding:10px 35px 10px 20px;
    right:30px;
    border-radius:10px;
    /* bottom:40px; */
  }
  .arrow {
    top:53%;
    left:48%;
  }
  .arrow span {
    width:8px;
    height:8px;
  }
  .eng .map_location .go_seeking_btn {
    padding:10px;
  }


  /* sub2-1 */
  .imagepanel,
  .image_container {
    height:250px;
  }    
  
}


@media (max-width: 400px) {

  /* sub1 공통 */
  /* .subheader-visual {
    height:286px;
  } */
  .sub-nav.sub1>ul>li {
    width:50%;
  }
  .subheader-visual>h2 {
    font-size:22px;
  }
  
  .sub_inner h3 strong {
    font-size:20px;
  }
  .sub_headline {
    font-size:16px;
    width: 96%;
  }
  .sub_headline span {
    font-size:18px;
  }
  .sub_headline i {
    display:block;
  }


  .sub_inner>.greeting:not(:nth-child(3)) {
    padding-top:80px;
  }

  /* sub1-1 회사소개 */
   .greet_explain {
    text-align:center;
    padding-top:20px;
  }
  .greet_title {
    height:180px;
    width:fit-content;
  }
  .greeting svg {
    width:180px;
  }
  .greet_title>.greet_icon {
    width:90%;
    /* left: 50%;
    transform: translate(-50%, -50%); */
  }
  .greet_icon>img {
    width:50%;
  }
  .greet_icon>p {
    font-size:18px;
  }
  .greet_explain>p:nth-child(2) {
    padding-top:8px;
  }
  .greet_explain>p>strong {
    font-size:16px;
    line-height:1.45;
  }
  .greet_explain>p>strong>i,
  .greet_explain>p>strong>br {
    display:block;
  }
  .greet_explain>p:nth-child(2) {
    font-size:14px;
  }
  .sign_ceo {
    padding-top:30px;
  }


  


  /* sub1-3 */
  .tab button {
    font-size:17px;
    width:130px;
    height:48px;
  }
  .timeline-item {
    padding-left:20px;
  }
  .timeline-marker {
    width:12px;
  }
  .timeline-marker:before {
    width:7px;
    height:7px;
    top:4px;
  }
  .timeline-marker:after {
    top:21px;
  }
  /* .timeline-item:not(.period):hover .timeline-marker:before {
    border-width:2px;
  } */
  .timeline h5 {
    font-size:24px;
  }
  .timeline-content p {
    font-size:14px;
  }

  


  /* sub1-4 */
  .patent>ul>li {
  /* gap:30px; */
  width:100px;
  }
  .patent li>div>div {
    width:100px;
  }
  .patent li p {
    font-size:12px;
  }
  .patent>ul>li:nth-child(n+2) {
    padding-top:67px
  }
  .patent li p {
    padding-top:18px;
  }

  


}

@media (min-width: 360px)and(max-width:400px) {

  /* sub1-4 */
  .patent>ul>li {
    width:105px;
  }
  .patent li>div>div {
    width:105px;
  }
}



/* 서브 공통 */
.greeting,
.vision,
.cor_history,
.patent,
.organization,
.map_location,
.bz_ai,
.bz_hrb,
.bz_dhb,
.list_cooper,
.info_rec,
.chart_benefit,
.table_contact {
    /* 
    transition:opacity 0.6s ease, transform 0.6s ease; */
    animation: 1.5s ease-in-out 0s 1 slideDownBtm;
}

@keyframes slideDownBtm {
    0% {
        transform:translateY(50px);
        opacity:0;
    }
    100% {
        transform:translateY(0);
        opacity:1;
    }
}