@charset "utf-8";

/* == Base == */
:root {
  --main-color: #75bd3d;
  --sub-color1: #00a8bf;
  --gray1: #666464;
  --gray2: #afafaf;
  --light-gray1 : #f6f6f3;
}

body {
  color: #3e3a39;
  font-family: 'Pretendard', sans-serif;
  font-size: 16px;
}

.lato {
  font-family: "Lato", "Pretendar", sans-serif;
}

small {
  font-size: 0.6em;
}

.catalog {
  background: #fff;
}

.catalog__contents {
  background: #fff;
}

/* == Navigations == */
.top_nav {position: absolute; top: 0; left: 0; z-index: 9999; width: 100%; display: flex; justify-content: flex-end; align-items: center; padding: 55px 80px 20px 80px; gap: 50px;}
.top_nav .logo {display: none;}
.top_nav .etc_nav {display: flex; gap: 15px;}
.top_nav .etc_nav .divider {width: 3px; background: #cfcdc9;}
.top_nav .etc_nav .btn {flex-shrink: 0; width: 36px; height: 36px; background: no-repeat center / cover; cursor: pointer; border-radius: 50%;}
.top_nav .etc_nav .btn--prev {background-image: url('../images/common/ico-prev.png');}
.top_nav .etc_nav .btn--next {background-image: url('../images/common/ico-next.png');}
.top_nav .etc_nav .btn--index {background-image: url('../images/common/ico-index.png');}
.top_nav .etc_nav .btn--play {background-image: url('../images/common/ico-play.png'); border: 1px solid #aaa79f; background-color: #fff;}
.top_nav .etc_nav .btn--play.pause {background-image: url('../images/common/ico-pause.png'); border: 1px solid #aaa79f;}
.top_nav .etc_nav .catalog__paging {position: static; transform: none; padding: 0; gap: 10px; display: flex;}
.first_page .catalog__paging .btn--prev {opacity: .5!important;}
.last_page .catalog__paging .btn--next {opacity: .5!important;}

.lnb_bar {display: none; align-items: center; justify-content: flex-end; gap: 50px; font-size: 18px;}
.lnb_bar.active {display: flex;}
.catalog.technology.intro .lnb_bar {display: none!important;}
.lnb--white .lnb_bar {color: #fff;}
.lnb_bar .lnb_btn.active {font-weight: 700;}
.lnb_bar.yellow .lnb_btn.active {color: #f8b616;}
.lnb_bar.orange .lnb_btn.active {color: #f08e17;}
.lnb_bar.green .lnb_btn.active {color: #75bc3e;}
.lnb_bar.blue .lnb_btn.active {color: #00a9be;}

.gnb_bar {position: absolute; top: 0; left: 0; z-index: 10000; width: 200px; height: 100%; display: flex; flex-direction: column;}
.gnb_bar::after {position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ''; box-shadow: inset 0 0 20px rgba(0,0,0,.2), inset 0 0 10px rgba(0,0,0,.1); display: block; pointer-events: none;}
.gnb_bar .head {width: 100%; height: 120px; display: flex; align-items: center; justify-content: center; padding: 20px; background: #dadce0;}
.gnb_bar .body {display: flex; flex-direction: column; width: 100%; height: 100%;}
.gnb_bar .body .gnb_btn {position: relative; width: 100%; height: 25%; background: #4b4948; color: #b3b3b3; padding: 20px 20px; border-bottom: 2px solid rgb(179, 179, 179, .1); transition: width 0.3s, border 0.3s, box-shadow .3s, background .3s;}
.gnb_bar .body .gnb_btn:last-child {border: none;}
.gnb_bar .body .gnb_btn .tag {font-size: 16px; font-weight: 500; display: block; line-height: 1; margin-bottom: 0.3em;}
.gnb_bar .body .gnb_btn .name {font-size: 26px; font-weight: 300; line-height: 1.1;}
.gnb_bar .body .gnb_btn .ico {opacity: 0; position: absolute; bottom: 10px; left: 20px; transform: scale(1); transform-origin: left bottom; transition: opacity .3s;}
.gnb_bar .body .gnb_btn .arw {position: absolute; bottom: 20px; right: 20px; width: 30px; opacity: .7;}
.gnb_bar .body .gnb_btn:nth-child(3) .ico {margin-bottom: -10px;}
.gnb_bar .body .gnb_btn.active {position: relative; z-index: 10; color: #fff; width: calc(100% + 20px); border-radius: 0 10px 10px 0; box-shadow: 5px 5px 5px rgba(0,0,0,.1);}
.gnb_bar .body .gnb_btn.active .ico {opacity: 1;}
.gnb_bar .body .gnb_btn.active .arw {opacity: 1;}
.gnb_bar .body .gnb_btn.active br.active_hide {display: none;}
.gnb_bar .body .gnb_btn:nth-child(1).active {background: #f8b616;}
.gnb_bar .body .gnb_btn:nth-child(2).active {background: #75bc3e;}
.gnb_bar .body .gnb_btn:nth-child(3).active {background: #00a9bc;}
.gnb_bar .body .gnb_btn:nth-child(4).active {background: #148acc;}
.gnb_bar .body .gnb_btn:nth-child(5).active {background: #a79ecd;}
.gnb_bar .body .gnb_btn:hover {color: #fff;}
.gnb_bar {transform: translate(-100%); transition: transform .4s;}
.gnb--show .gnb_bar {transform: translate(0);}

.mo_catalog__paging {display: none;}

@media screen and (max-width: 767px) {
  .top_nav .etc_nav .btn--prev,
  .top_nav .etc_nav .btn--next,
  .submenu_container,
  .gnb_bar {display: none;}

  .top_nav {position: fixed; top: 0; left: 0; width: 100%; z-index: 9999; padding: 0 20px; height: 70px; background: rgb(255,255,255,.3); backdrop-filter: blur(5px);}
  .top_nav .logo {display: block; margin-right: auto; cursor: pointer;}
  .top_nav .etc_nav {gap: 0 10px;}
  .top_nav .etc_nav .divider {display: none;}

  .mo_catalog__paging {
    position: fixed;
    bottom: 0;
    left: 0;
    display: flex;
    width: 100%;
    border-top: 1px solid #dadada;
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(10px);
    height: auto;
    padding: 10px 20px;
    z-index: 9999;
    pointer-events: initial;
  }
  .mo_catalog__paging .tag {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
  }
  .mo_catalog__paging .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #afafaf;
  }
  .mo_catalog__paging .btn .arrow {
    border-color: #666;
  }
  .mo_catalog__paging .btn--prev .arrow {
    margin-left: 5px;
  }
  .mo_catalog__paging .btn--right .arrow {
    margin-right: 5px;
  }
  .last-page .mo_catalog__paging .btn--next {
    opacity: 0.4;
    pointer-events: none;
  }
}

ul.numeric {
}
ul.numeric > li {
  display: flex;
  align-items: flex-start;
  margin-bottom: 5px;
}
ul.numeric > li:last-child {
  margin-bottom: 0;
}
ul.numeric > li > .no {
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #000;
  color: #fff;
  border-radius: 50%;
  font-size: 10px;
  margin-top: 2px;
  margin-right: 5px;
  flex-shrink: 0;
}
ul.numeric > li > .key {
  line-height: 1.5;
}

.cards {
  display: flex;
  flex-wrap: wrap;
  width: calc(100% + 20px);
  margin-left: -10px;
}
.cards .card {
  padding: 10px;
}
.cards--col2 .card {
  width: 50%;
}
.cards--col3 .card {
  width: calc(100% / 3);
}
.cards--col4 .card {
  width: 25%;
}
.cards--col5 .card {
  width: 20%;
}

@media screen and (max-width: 499px) {
  .cards--col2 .card,
  .cards--col3 .card,
  .cards--col4 .card,
  .cards--col5 .card {
    width: 100%;
  }
}

.flex--dir--col {
  display: flex;
  flex-direction: column;
}

.split_txt i {
  display: inline-block;
  font-style: normal;
  opacity: 0;
  -webkit-will-change: transform;
  -moz-will-change: transform;
  -ms-will-change: transform;
  will-change: transform;
}
.catalog__page.active_page .split_txt.down i {
  display: inline-block;
  font-style: normal;
  animation-name: splitTxtDown;
  animation-duration: 0.8s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  opacity: 0;
}
.catalog__page.active_page .split_txt.up i {
  display: inline-block;
  font-style: normal;
  animation-name: splitTxtUp;
  animation-duration: 0.8s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  opacity: 0;
}
.catalog__page.active_page .split_txt.left i {
  display: inline-block;
  font-style: normal;
  animation-name: splitTxtLeft;
  animation-duration: 1.4s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  opacity: 0;
}
.catalog__page.active_page .split_txt.right i {
  display: inline-block;
  font-style: normal;
  animation-name: splitTxtRight;
  animation-duration: 1.4s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes splitTxtDown {
  from {
    opacity: 0;
    transform: translate(0, -1em);
  }
  to {
    opacity: 1;
    transform: translate(0);
  }
}
@keyframes splitTxtUp {
  from {
    opacity: 0;
    transform: translate(0, 1em);
  }
  to {
    opacity: 1;
    transform: translate(0);
  }
}
@keyframes splitTxtLeft {
  0% {
    opacity: 0;
    transform: translate(1em, 0);
  }
  50% {
    opacity: 0.5;
    transform: translate(0);
  }
  100% {
    opacity: 1;
    transform: translate(0);
  }
}
@keyframes splitTxtRight {
  0% {
    opacity: 0;
    transform: translate(-1em, 0);
  }
  50% {
    opacity: 0.5;
    transform: translate(0);
  }
  100% {
    opacity: 1;
    transform: translate(0);
  }
}

.catalog__wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}
.catalog__page {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.catalog__page.active_page {
  position: relative;
  z-index: 3;
  opacity: 1;
}
.catalog__page.prev_page {
  z-index: 0;
  opacity: 0;
}
.catalog__page.next_page {
  z-index: 0;
  opacity: 0;
}

.page__container {
  padding: 0;
}
.page__contents {
  position: relative;
  z-index: 1;
  height: 100%;
  padding: 90px 85px 90px 160px;
}
.main_contents .page__contents {
  padding: 115px 70px 70px 200px;
}
.main_contents .page__contents__container {
  display: flex; flex-direction: column;
  height: 100%;
  padding: 0 0 0 85px;
}
.main_contents2 .page__contents {padding: 0!important;}
.main_contents2 .page__contents__container {display: flex; height: 100%;}
.main_contents2 .page__contents__container .page__contents__head {position: relative; padding: 115px 70px 70px 285px; color: #fff; width: 765px; flex-shrink: 0;}
.main_contents2 .page__contents__container .page__contents__head .bg {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;}
.main_contents2 .page__contents__container .page__contents__body {padding: 115px 70px 70px 70px; width: 100%;}
.cover-pager {
  position: absolute;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.cover-pager.half {width: 50%;}
.cover-pager.half.prev {left: 0;}
.cover-pager.half.next {left: auto; right: 0;}

@media screen and (max-width: 767px) {
  .catalog {min-width: 320px;}
  .page__contents {padding: 100px 20px!important; min-height: 100vh;}
  .main_contents .page__contents__container {padding: 0; gap: 20px;}
  .main_contents .page__contents__container.flex--row {flex-direction: column!important;}

  .main_contents2 .page__contents__container {display: block; min-height: 100vh; height: auto;}
  .main_contents2 .page__contents__container .page__contents__head {padding: 150px 20px 50px 20px; width: 100%;}
  .main_contents2 .page__contents__container .page__contents__body {padding: 50px 20px 100px 20px!important;}
}

/* == Page Custom == */
#firstCover1 .page__contents {padding: 120px 90px 80px 130px; display: flex; flex-direction: column;}
#firstCover1 .title {}
#firstCover1 .desc {color: #b5b6b6;}
#firstCover1 .desc span {color: #898989;}
#firstCover1 .url {margin-top: auto;}
#firstCover1 .logo {position: absolute; bottom: 80px; right: 90px;}

@media screen and (max-width: 767px) {}

#firstCover2 {
}
#firstCover2 .page__contents {
  display: flex;
  padding: 120px 90px 100px 90px;
}
#firstCover2 .contbox {
  width: 720px;
  position: relative;
  z-index: 10;
}
#firstCover2 .contbox .logo {
  position: absolute;
  left: 0;
  bottom: 0;
}
#firstCover2 .contbox .title {position: absolute; top: 50%; left: 0; transform: translate(0, -50%); white-space: nowrap; font-size: 107px;}
#firstCover2 .contbox .title .txt2 {margin-left: 1.5em;}
#firstCover2 .contbox .title .gradient {display: inline-block;}
#firstCover2 .contbox .title .gradient i {display: inline-block; color: transparent; background: linear-gradient(to right, #74bc3f, #008f58, #316049); -webkit-background-clip: text;}
#firstCover2 .imgbox {
  width: calc(100% - 720px);
}
#firstCover2 .imgbox {
  display: flex;
  width: calc(100% - 700px);
  margin-left: -10px;
}
#firstCover2 .imgbox > .elem {
  padding: 0 10px;
}
#firstCover2 .imgbox > .elem .inner {
  position: relative;
  width: 100%;
  height: 100%;
}
#firstCover2 .imgbox > .elem1 {
  width: calc(200% / 3);
}

#firstCover2 .imgbox > .elem1 .line {position: absolute;}
#firstCover2 .imgbox > .elem1 .line1 {top: 61px; right: 100%; height: 33px;}
#firstCover2 .imgbox > .elem1 .line2 {bottom: 71px; right: 100%; height: 33px;}

#firstCover2 .imgbox > .elem2 {
  width: calc(100% / 3);
  opacity: 1;
}
#firstCover2 .imgbox > .elem3 {
  width: calc(100% / 3);
  opacity: 1;
}
.catalog__page--active .anime--active#firstCover2 .imgbox > .elem2 {
  transform: translate(0, -40px);
}
.catalog__page--active .anime--active#firstCover2 .imgbox > .elem3 {
  transform: translate(0, 40px);
}

@keyframes firstElem2 {
  to {
    transform: translate(0, -40px);
  }
}
@keyframes firstElem3 {
  to {
    transform: translate(0, 40px);
  }
}

@media screen and (max-width: 767px) {}

#indexPage {
}
#indexPage .page__contents {
  display: flex;
  flex-direction: column;
  width: 55%;
  padding-right: 55px;
}
#indexPage .page__sbj {
  margin-bottom: auto;
}
#indexPage .page__sbj::after {
  position: absolute; 
  top: 0; left: 0;
  width: 100vw;
  height: 190px;
  background: #f6f6f3;
  content: '';
  display: block;
  z-index: -1;
}
#indexPage .index__tbl_container {
  display: flex;
  gap: 35px;
}
#indexPage .index__tbl_box {
  width: 100%;
}
#indexPage .index__tbl {
  display: flex;
  border-top: 1px solid #727171;
  margin-top: 40px;
}
#indexPage .index__tbl h3 {
  width: 110px;
  padding: 10px 0;
  flex-shrink: 0;
  font-size: 20px;
}
#indexPage .index__tbl_box.color1 .index__tbl h3 {color: #75bc3e;}
#indexPage .index__tbl_box.color2 .index__tbl h3 {color: #009459;}
#indexPage .index__tbl .index__ls {
  width: 100%;
  padding-left: 20px;
}
#indexPage .index__ls {
}
#indexPage .index__ls > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 0;
  border-bottom: 1px solid #dfdfdf;
}
#indexPage .index__ls > a .val {
  font-size: 14px;
}
#indexPage .index__ls > a .ico--circle {
  width: 20px;
  height: 20px;
  border-color: #afafaf;
}
#indexPage .index__ls > a .ico--circle .arrow {
  border-width: 1px;
}
#indexPage .bg_elem {
  position: absolute;
  top: 0;
  right: 64px;
  z-index: 5;
  width: auto;
  height: auto;
  display: flex;
}
#indexPage .bg_elem .col {
  display: flex;
  flex-direction: column;
  height: auto;
  padding: 0 20px;
  animation-duration: 10s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  -webkit-will-change: transform;
  -moz-will-change: transform;
  -ms-will-change: transform;
  will-change: transform;
}
#indexPage .bg_elem .col:nth-child(1) {
  justify-content: flex-start;
  transform: translate(0, 0);
  animation-name: indexBg1;
}
#indexPage .bg_elem .col:nth-child(2) {
  justify-content: flex-end;
  transform: translate(0, -50%);
  animation-name: indexBg2;
}
#indexPage .bg_elem img {
  display: block;
  margin: 25px 0;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

@keyframes indexBg1 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(0, -50%);
  }
}
@keyframes indexBg2 {
  0% {
    transform: translate(0, -50%);
  }
  100% {
    transform: translate(0, 0);
  }
}

@media screen and (max-width: 767px) {}

#companyIntro {}
#companyIntro .bg {position: absolute; top: 0; left: 0; width: 780px; height: 100%;}
.catalog__page--active .anime--active#companyIntro .bg {transform: translate(0);}
#companyIntro .content_box {display: flex; flex-direction: column; width: calc(100% - 580px); height: 100%; margin-left: auto; padding: 100px 0 0 85px;}
#companyIntro .content_box .head {gap: 0 40px;}
#companyIntro .content_box .head .sbj {color: #00a9be;}
#companyIntro .content_box .head .sbj span {display: inline-block; border-bottom: 1px solid #00a9be;}
#companyIntro .content_box .body {margin-top: auto;}
#companyIntro .content_box .body img {max-width: none; margin-left: -85px;}

#companyOverview .page__contents__body {height: 100%; position: relative;}
#companyOverview table {position: relative; z-index: 1; width: 1110px; border-top: 2px solid #98cd6e; background: #fff; font-size: 18px; margin-left: auto; margin-top: 30px; text-align: center;}
#companyOverview table small {font-size: 0.7em; font-weight: 400;}
#companyOverview table tr {border-bottom: 1px solid #dfdfdf;}
#companyOverview table th,
#companyOverview table td {height: 70px; padding: 10px 20px; vertical-align: middle;}
#companyOverview table .th1 {width: 130px; background: #efece6;}
#companyOverview table .th2 {background: #f6f4f1;}
#companyOverview table td {}
#companyOverview table .td1 {width: 180px;}
#companyOverview table .td2 {}
#companyOverview .bg {position: absolute; left: -85px; bottom: -70px; width: calc(100% + 155px); height:  582px; z-index: -1;}

#companyBusiness .cont_img {margin-left: 40px; display: block; max-width: none;}
#companyBusiness .bg {position: absolute; bottom: 0; right: 0; width: 100%; height: 100%; z-index: -1;}

.history_cont {padding-top: 50px;}
.history_cont .block {display: flex; gap: 20px; padding: 20px 0; border-top: 1px solid #b5b6b6;}
.history_cont .block .titlebox {width: 325px;}
.history_cont .block .titlebox .tit {text-transform: uppercase; font-weight: 500;}
.history_cont .block .titlebox .desc {font-weight: 300; color: var(--gray1);}
.history_cont .block .his_ls {width: 470px; padding-right: 30px;}
.history_cont .block .his_ls > li {display: flex; align-items: flex-start; margin-bottom: 0.5em;}
.history_cont .block .his_ls > li .year {width: 95px; font-weight: 500; line-height: 1.8; text-align: right; padding-right: 20px; flex-shrink: 0;}
.history_cont .block .his_ls > li .cont {line-height: 1.8;}
.history_cont .block:nth-child(1) .titlebox .tit,
.history_cont .block:nth-child(1) .his_ls > li .year {color: #00a9bc;}
.history_cont .block:nth-child(2) {padding-bottom: 50px;}
.history_cont .block:nth-child(2) .titlebox .tit,
.history_cont .block:nth-child(2) .his_ls > li .year {color: #0057a6;}
.history_cont .block:nth-child(3) .titlebox .tit,
.history_cont .block:nth-child(3) .his_ls > li .year {color: #31296b;}
.history_cont .block:nth-child(3) .thumb {margin-top: -40px; margin-left: auto;}
#companyHistory .deco {position: absolute; left: 200px; bottom: 0;}

.cert_cont {display: flex; flex-direction: column; gap: 28px; padding-top: 50px;}
.cert_box {position: relative; display: flex; gap: 20px;}
.cert_sbj {position: absolute; top: 60px; right: 100%; width: 255px; font-weight: 500; padding-bottom: 5px;}
.cert_sbj::after {position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; content: ''; background: linear-gradient(to right, #b5b6b6, transparent);}
.cert_ls {display: flex; justify-content: flex-end; gap: 30px 44px; margin-left: auto;}
.cert_ls > li {padding: 5px 10px; position: relative;}
.cert_ls > li::before {content: ""; position: absolute; bottom: 0; left: 0; width: calc(100% - 20px); height: calc(100% - 20px); display: block; z-index: -1; background: #f2f3f4;}
.cert_ls li img {display: block; box-shadow: 0 0 3px rgba(0,0,0,.05), 0 0 5px rgb(0,0,0,.05), 3px 3px 10px rgb(0,0,0,.1);}
.cert_ls li span {display: block; padding: 10px 0; font-size: 14px; padding-right: 10px; word-break: keep-all;}
.cert_box:nth-child(1) .cert_sbj {color: #00479d;}
.cert_box:nth-child(2) .cert_sbj {color: #00a9bc;}

#blockDevelope1 .page__contents__body .cont1 {position: absolute; bottom: 0; right: 0; z-index: 1;}
#blockDevelope1 .page__contents__body .cont2 {position: absolute; bottom: 0; left: 200px; z-index: 0;}
#blockDevelope2 .page__contents__body .cont {position: absolute; bottom: 0; right: 430px; z-index: 1;}
#blockDevelope2 .page__contents__body .bg {position: absolute; bottom: 0; right: 0; width: calc(100% - 200px); height: 581px;}

#verify .page__contents__body {display: flex; justify-content: space-between;}

#merchanization .page__contents__body {display: flex; align-items: flex-end; justify-content: space-between; margin-top: -80px;}

#maintanance .page__contents__head .cont_img {max-width: none; margin-top: 45px; margin-left: -40px; display: block;}
#maintanance .page__contents__body {position: relative; padding-left: 364px; padding-top: 168px;}
#maintanance .page__contents__body .bg {position: absolute; bottom: 0; left: 0; width: 100%; height: 410px; z-index: -1;}
#maintanance .page__contents__body h4 {color: #009459;}

#techIntro {}
#techIntro .page__contents__container {display: flex; justify-content: flex-end;}
#techIntro .page__contents__container .cont {display: block;}

.tab_container .tab_btns {display: flex; justify-content: flex-end; gap: 5px; padding: 0 10px 0 0;}
.tab_container .tab_btns .tab_btn {width: 220px; height: 46px; display: flex; align-items: center; padding: 0 20px; border-radius: 10px 10px 0 0; background: #a0a0a0; color: #fff; font-size: 20px; font-weight: 700; cursor: pointer;}
.tab_container .tab_contents_wrap {background: #fff; box-shadow: 0px 0px 5px rgb(0,0,0,.1), 0px 0px 10px rgb(0,0,0,.1), 5px 5px 15px rgb(0,0,0,.1);}
.tab_container .tab_contents {display: flex; overflow: hidden; height: 560px; gap: 30px;}
.tab_container .tab_contents .titlebox {width: 646px; padding: 44px 0 0 60px; position: relative; flex-shrink: 0;}
.tab_container .tab_contents .titlebox .title {line-height: 1.1; margin-bottom: .2em;}
.tab_container .tab_contents .titlebox .desc {color: #707070;}
.tab_container .tab_contents .titlebox .thumb {position: absolute; bottom: 0; left: 0;}
.tab_container .tab_contents .contbox {padding: 44px 60px 44px 0; width: 100%;}
.tab_container .tab_contents .contbox section {display: flex; justify-content: space-between; align-items: flex-start; border-top: 1px solid #d1d1d1; padding: 20px 0 30px 0; gap: 20px;}
.tab_container .tab_contents .contbox section .cont {}
.tab_container .tab_contents .contbox section .cont .title {display: flex; align-items: center; gap: 18px; margin-bottom: 20px;}
.tab_container .tab_contents .contbox section .cont .title .ico {flex-shrink: 0;}
.tab_container .tab_contents .contbox section .cont .title .sbj {margin-bottom: 0;}
.tab_container .tab_contents .contbox section .cont .desc {color: #666;}
.tab_container .tab_contents .contbox section .img img  {display: block;}

.tab_container .tab_btns .tab_btn.green.active {background: #75bc3e;}
.tab_container .tab_contents.green .contbox section .cont .title .sbj,
.tab_container .tab_contents.green .titlebox .title {color: #75bc3e;}
.tab_container .tab_btns .tab_btn.blue.active {background: #148acc;}
.tab_container .tab_contents.blue .contbox section .cont .title .sbj,
.tab_container .tab_contents.blue .titlebox .title {color: #148acc;}

#techFeature .page__contents__container .page__contents__head {color: #333; width: 1166px;}
#techFeature .feat_ls li {padding: 28px 0; border-bottom: 1px solid #dfdfdc;}
#techFeature .feat_ls li span {margin-bottom: 1em;}
#techFeature .feat_ls li span b {font-weight: 600;}
#techFeature .feat_ls li img {display: block;}
#techFeature .page__contents__container .page__contents__head .visual {position: absolute; bottom: 0; right: -73px; z-index: 0;}
#techFeature .page__contents__body {display: flex; align-items: center; justify-content: flex-end;}
#techFeature .page__contents__body .cont {padding-top: 80px;}

.pg--function nav {display: flex; flex-direction: column; gap: 5px; width: 240px; margin-top: 20px;}
.pg--function nav a {display: flex; align-items: center; justify-content: space-between; gap: 0 10px; font-size: 24px; font-weight: 700;}
.pg--function nav a.active {color: #148acc;}
.pg--function nav a.active strong {color: #00a9bc;}
.pg--function nav a .ico--circle {width: 24px; height: 24px;}
.pg--function .contbox {display: flex; align-items: flex-end; gap: 50px; margin-top: -150px;}

#structure .contbox {display: flex; justify-content: space-between; align-items: flex-end; margin-top: -80px;}
#structure .page__contents__body .bg {position: absolute; bottom: 0; left: 0; width: 100%; height: 380px; z-index: -1;}
#structure .contbox .cont img {display: block; margin-bottom: 30px;}
#structure .contbox .cont .txt .bullet li {font-size: 24px; padding-bottom: 0.1em;}
#structure .contbox .cont .txt .bullet li b {color: #008370;}
#structure .contbox .cont3 {display: flex; flex-direction: column; gap: 50px; padding: 35px 40px; background: #fff; border-radius: 30px; box-shadow: 0 0 5px rgb(0,0,0,.05), 5px 5px 5px rgb(0,0,0,.05), 5px 5px 10px rgb(0,0,0,.05); height: 100%;}
#structure .contbox .cont3 .item .sbj {color: #308da9;}

#application .contbox {display: flex; gap: 33px;}
#application nav {display: flex; flex-direction: column; gap: 15px; width: 242px; position: relative; z-index: 10;}
#application nav a {display: flex; flex-direction: column; justify-content: space-between; height: 90px; padding: 15px 18px; color: #707070; background: #dadce0;}
#application nav a .sbj {display: block; font-size: 24px; font-weight: 700;}
#application nav a .desc {display: flex; align-items: center; justify-content: space-between; padding: 0 0 0 1em; font-size: 18px; color: transparent;}
#application nav a .desc .arrow {border-color: #adadad;}
#application nav a.active {background: linear-gradient(to right, #75bc40, #158acc); width: calc(100% + 75px); box-shadow: 3px 3px 5px rgb(0,0,0,.1), 3px 3px 6px rgb(0,0,0,.1);}
#application nav a.active .sbj {color: #fff;}
#application nav a.active .desc {color: #d6d6d6;}
#application nav a.active .desc .arrow {opacity: 0;}
#application .imgbox {display: flex; align-items: flex-start; gap: 5px; margin-top: -60px;}

#equipIntro {}
#equipIntro .contbox {display: flex; flex-direction: column; align-items: flex-start; padding-left: 100px;}
#equipIntro .contbox .sbj {background: linear-gradient(to right, #74bc42, #2f94be); -webkit-background-clip: text; color: transparent;}
#equipIntro .contbox .sbj small {font-size: 0.8em;}
#equipIntro .contbox .diagram {display: flex; flex-wrap: nowrap; margin: 20px 0 20px 30px; position: relative;}
#equipIntro .contbox .diagram .deco {position: absolute; top: 50%; left: 0; transform: translate(calc(-100% - 30px), -50%);}
#equipIntro .contbox .diagram .item {width: 260px; height: 260px; border-radius: 50%; background: #dfdfdf; color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 30px; margin-left: -30px; mix-blend-mode: multiply;}
#equipIntro .contbox .diagram .item .bar {display: block; width: 60%; height: 2px; background: #d5cc10; margin: 10px auto;}
#equipIntro .contbox .diagram .item .txt {font-size: 22px; font-weight: 700; line-height: 1.5;}
#equipIntro .contbox .diagram .item:nth-of-type(2n-1) {background: #75bc3e;}
#equipIntro .contbox .diagram .item:nth-of-type(2n) {background: #00a9bc;}
#equipIntro .contbox .sbj2 {color: #707070; margin-bottom: 1em;}
#equipIntro .equip_ls {display: flex; gap: 30px;}
#equipIntro .equip_ls .item {width: calc(100% / 3); border-top: 1px solid #c2c2c2; padding: 20px 0;}
#equipIntro .equip_ls .item .tit {color: #148acc;}
#equipIntro .equip_ls .item .desc {font-size: 14px; margin-bottom: 1em;}
#equipIntro .equip_ls .item .thumb {display: block;}

#equipSpec .m_overflow_container--x {box-shadow: 0 0 10px rgb(0,0,0,.05); background: #fff;}
#equipSpec .cont {min-width: 1000px;}
#equipProcess .cont {min-width: 1000px;}

#prodLineup .bg {position: absolute; top: 0; right: 0; width: 100%; height: 100%; z-index: -1;}
#prodLineup .page__contents__body {height: 100%;}
#prodLineup .page__contents__body .prod_ls_container {display: flex; gap: 40px; align-items: center; justify-content: flex-end; height: 100%;}
#prodLineup .page__contents__body .prod_ls {position: relative; padding: 40px 25px; background: #fff; border-radius: 10px; box-shadow: 5px 5px 5px rgb(0,0,0,.05), 10px 10px 30px rgb(0,0,0,.4); width: 320px;}
#prodLineup .page__contents__body .prod_ls .tit {margin-bottom: 1em;}
#prodLineup .page__contents__body .prod_ls ul {border-top: 1px solid #afafaf;}
#prodLineup .page__contents__body .prod_ls ul li {border-bottom: 1px solid #afafaf;}
#prodLineup .page__contents__body .prod_ls ul li a {display: flex; align-items: center; justify-content: space-between; gap: 1em; padding: .8em 0 .8em .5em; font-size: 24px;}
#prodLineup .page__contents__body .prod_ls ul li a .ico--circle {width: 18px; height: 18px;}
#prodLineup .page__contents__body .prod_ls ul li a .ico--circle .arrow {width: 40%; height: 40%; border-width: 1px; margin-left: -3px}
#prodLineup .page__contents__body .prod_ls .thumb {position: absolute;}
#prodLineup .page__contents__body .prod_ls:nth-child(1) {padding-bottom: 110px; margin-top: auto;}
#prodLineup .page__contents__body .prod_ls:nth-child(1) ul li a:hover,
#prodLineup .page__contents__body .prod_ls:nth-child(1) .tit {color: #47618b;}
#prodLineup .page__contents__body .prod_ls:nth-child(1) .thumb {bottom: -37px; right: -160px}
#prodLineup .page__contents__body .prod_ls:nth-child(2) {margin-top: -20px; margin-bottom: auto;}
#prodLineup .page__contents__body .prod_ls:nth-child(2) ul li a:hover,
#prodLineup .page__contents__body .prod_ls:nth-child(2) .tit {color: #83bbcb;}
#prodLineup .page__contents__body .prod_ls:nth-child(2) .thumb {top: -70px; right: -45px;}
#prodLineup .page__contents__body .prod_ls:nth-child(3) ul li a:hover,
#prodLineup .page__contents__body .prod_ls:nth-child(3) .tit {color: #70a079;}
#prodLineup .page__contents__body .prod_ls:nth-child(3) .thumb {top: -60px; right: -35px;}

.pg--product .page__contents__head {display: flex; align-items: flex-end; gap: 1.5em; margin-bottom: 50px;}
.pg--product .page__contents__head .page__contents__sbj {margin-bottom: 0; line-height: 1;}
.pg--product .prod_tab {display: flex; align-items: center; justify-content: flex-start; gap: 0 10px; font-size: 24px; font-weight: 500;}
.pg--product .prod_tab.active {color: #148acc;}
.pg--product .prod_tab .ico--circle {width: 24px; height: 24px;}

.prod_lnb {display: flex; justify-content: space-around; align-items: center; padding: 20px 50px; background: #ebecef; border-start-end-radius: 5px; text-align: center; position: absolute; bottom: 70px; right: 70px; z-index: 100; width: calc(100% - 355px); border-radius: 10px; transform: translate(0, 30%); opacity: 0; pointer-events: none; transition: transform .3s, opacity .3s;}
.catalog.product:not(.line_up) .prod_lnb {transform: translate(0); opacity: 1; pointer-events: initial;}
.prod_lnb a .thumb {display: flex; align-items: center; justify-content: center; position: relative; width: 106px; height: 82px; margin: 0 auto 5px auto;}
.prod_lnb a .thumb::before {width: 82px; height: 82px; content: ''; position: absolute; top: 50%; left: 50%; border-radius: 50%; z-index: 0; background: linear-gradient(135deg, #72b86c, #3999c2); transform: translate(-50%, -50%) scale(.5); opacity: 0; transition: transform .5s, opacity .5s;}
.prod_lnb a .thumb img {display: block; position: relative; z-index: 1; opacity: .5;}
.prod_lnb a:hover .thumb img {opacity: 1;}
.prod_lnb a .name {font-size: 16px; font-weight: 300;}
.prod_lnb a.active .thumb img {opacity: 1;}
.prod_lnb a.active .thumb::before {transform: translate(-50%, -50%) scale(1); opacity: 1;}
.prod_lnb a.active .name {color: #3bbac9; font-weight: 500;}

.pg--product .page__contents__body {height: 100%;}
.prod_overview {position: relative; height: 100%;}
.prod_overview__thumb {position: absolute; top: -70px; right: 0;}
.prod_overview__diagram {position: relative; height: 370px; display: flex; align-items: center;}
.prod_overview__diagram .thumb {position: absolute; bottom: -30px; left: 50%; transform: translate(-50%, 0);}
#granitoBlock .prod_overview__diagram .thumb {position: absolute; bottom: 13px; left: 50%; transform: translate(-50%, 0);}
.prod_overview__diagram .thumb img {display: block;}
.prod_overview__diagram .icons {display: flex; position: relative; width: 100%; justify-content: space-between;}
.prod_overview__diagram .icons .bar {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 40px); height: 2px; z-index: -1;}
#superGrassBlock .prod_overview__diagram .icons .bar {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 113px); height: 2px; z-index: -1;}
.prod_overview__diagram .icons .bar .inner {width: 100%; height: 100%; background: linear-gradient(to right, #7fc347, #2690c4, #7fc347);}
.prod_overview__diagram .icons .group {display: flex; justify-content: space-between; align-items: center; width: 470px;}
.prod_overview__diagram .icons .group li {position: relative;}
.prod_overview__diagram .icons .group li .icon {width: 90px; height: 90px; border-radius: 50%; padding: 3px; border: 2px solid #afafaf;}
.prod_overview__diagram .icons .group li .icon .inner {width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: #afafaf;}
.prod_overview__diagram .icons .group li .icon .inner img {display: block;}
.prod_overview__diagram .icons .group li .txt {position: absolute; top: 100%; left: 0; display: block; margin-top: 20px; white-space: nowrap; font-size: 18px;}
.prod_overview__diagram .icons .group:nth-of-type(1) li:nth-of-type(1) .icon {border-color: #85c54154;}
.prod_overview__diagram .icons .group:nth-of-type(1) li:nth-of-type(2) .icon {border-color: #60bc6547;}
.prod_overview__diagram .icons .group:nth-of-type(1) li:nth-of-type(3) .icon {border-color: #34b38d45;}
.prod_overview__diagram .icons .group:nth-of-type(1) li:nth-of-type(1) .icon .inner {background: #7fc347;}
.prod_overview__diagram .icons .group:nth-of-type(1) li:nth-of-type(2) .icon .inner {background: #60bc64;}
.prod_overview__diagram .icons .group:nth-of-type(1) li:nth-of-type(3) .icon .inner {background: #34b38d;}
.prod_overview__diagram .icons .group:nth-of-type(2) li:nth-of-type(1) .icon {border-color: #34b38d45;}
.prod_overview__diagram .icons .group:nth-of-type(2) li:nth-of-type(2) .icon {border-color: #60bc6547;}
.prod_overview__diagram .icons .group:nth-of-type(2) li:nth-of-type(3) .icon {border-color: #85c54154;}
.prod_overview__diagram .icons .group:nth-of-type(2) li:nth-of-type(1) .icon .inner {background: #34b38d;}
.prod_overview__diagram .icons .group:nth-of-type(2) li:nth-of-type(2) .icon .inner {background: #60bc64;}
.prod_overview__diagram .icons .group:nth-of-type(2) li:nth-of-type(3) .icon .inner {background: #7fc347;}

.prod_spec {display: flex; align-items: flex-end; gap: 30px 75px; height: 420px;}
.prod_spec .box {display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; width: 50%; gap: 20px;}
.prod_spec .cert {display: flex; align-items: flex-start; gap: 10px 30px;}
.prod_spec .spec {width: 100%;}
.prod_spec .spec table {width: 100%; text-align: center; font-size: 16px;}
.prod_spec .spec table th,
.prod_spec .spec table td {padding: 10px; vertical-align: middle;}
.prod_spec .spec table thead {}
.prod_spec .spec table thead th {background: #75bc3e; border-right: 2px solid #fff; color: #fff;}
.prod_spec .spec table thead th.empty {background: none; border-bottom: 2px solid #75bc3e;}
.prod_spec .spec table tbody tr {border-bottom: 1px solid #bade9f;}
.prod_spec .spec table tbody tr:last-child {border-bottom: 1px solid #75bc3e;}
.prod_spec .spec table tbody th {background: #f6f6f3;}
.prod_spec .spec table tbody th,
.prod_spec .spec table tbody td {border-right: 2px solid #fff;}
.prod_spec .spec table tbody th.th1 {color: #75bc3e;}
.prod_spec .spec table tbody th.th2 {}
.prod_spec .spec table tbody td {}
.prod_spec .spec .noti {font-size: 14px; text-align: right; display: block; margin-top: 0.5em;}
.prod_spec .color {display: flex; align-items: flex-start; gap: 10px 30px;} 
.prod_spec .color .color_ls {display: flex; gap: 10px 15px;} 
.prod_spec .color .color_ls ul {display: flex; gap: 3px; position: relative;} 
.prod_spec .color .color_ls ul li {} 
.prod_spec .color .color_ls ul li img {display: block;} 
.prod_spec .color .color_ls ul.ordered::after {display: block; content: '주문제작'; position: absolute; top: 100%; left: 0; margin-top: 5px;}

#threeDWholeBlock .prod_spec .thumb {display: block; margin: -40px 0 0 auto;}
#granitoBlock .prod_overview__diagram .icons {margin-bottom: 50px;}
#superGrassBlock .page__contents__head .cert_img {margin-left: 150px;}
#superGrassBlock .page__contents__body {display: flex; gap: 30px; justify-content: space-between;}
#superGrassBlock .page__contents__body .prod_overview {width: 50%;}
#superGrassBlock .prod_overview__diagram .thumb {left: auto; right: -80px; bottom: -6px; transform: none;}
#superGrassBlock .prod_overview__diagram .icons {margin-bottom: 120px;}
#superGrassBlock .prod_overview__diagram .icons .group {width: 350px;}
#superGrassBlock .page__contents__body .prod_spec {width: 45%; padding-bottom: 50px; position: relative;}
#superGrassBlock .page__contents__body .prod_spec .thumb {display: block; margin: 0 0 30px auto;}
#superGrassBlock .page__contents__body .prod_spec .box {width: 100%;}

#lastCover .bg {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;}
#lastCover .txtbox .title {color: #fff; font-weight: 800;}
#lastCover .txtbox .title .green {color: #75bc3e;}
#lastCover .txtbox .title .blue {color: #00a9bc;}
#lastCover .txtbox .desc {color: #9a9d9b;}
#lastCover .diagram {position: absolute; right: 160px; top: 138px;}

#lastPage {}
#lastPage .page__contents {display: flex; flex-direction: column; justify-content: center; align-items: center;}
#lastPage .page__contents .logo {margin: auto;}
#lastPage .page__contents address {width: 100%; font-style: normal; font-size: 18px;}
#lastPage .page__contents address ul {}
#lastPage .page__contents address ul li {display: flex; gap: .5em; padding: 7px 0;}
#lastPage .page__contents address ul li .tag {font-size: 15px; line-height: 1; padding: 5px 10px; border-radius: 50px; background: #dfdfdf; color: #fff; font-weight: 500;}
#lastPage .page__contents address ul li .tag.blue {background: #148acc;}
#lastPage .page__contents address ul li .tag.skyblue {background: #00a9bc;}
#lastPage .page__contents address ul li .val {color: #595757;}
#lastPage .page__contents address ul li .val .item {display: inline-block; margin: 0 .5em;}
#lastPage .page__contents address ul li .val .item b {color: #898989;}

#whyDaeiltec {}
#whyDaeiltec .page__container {background: #2eb4cf; color: #fff;}
#whyDaeiltec .page__contents {padding: 110px;}
#whyDaeiltec .page__contents .cont {display: flex; flex-direction: column; height: 100%; position: relative; z-index: 1;}
#whyDaeiltec .reason {margin-top: auto; display: flex; gap: 30px 110px;}
#whyDaeiltec .reason li:nth-child(1) h3 {color: #f8b616;}
#whyDaeiltec .reason li:nth-child(2) h3 {color: #2587f1;}
#whyDaeiltec .reason li:nth-child(3) h3 {color: #d6de00;}
#whyDaeiltec .deco {position: absolute; bottom: 0; right: 0; width: 1074px; height: 750px; z-index: 0;}
#whyDaeiltec .deco .item {position: absolute; width: 166px; height: 166px; background: #fff; border-radius: 50%;}
#whyDaeiltec .deco .item:nth-child(1) {background: #fff; bottom: -60px; left: 464px;}
#whyDaeiltec .deco .item:nth-child(2) {background: #75bc3e; left: 485px; top: 400px;}
#whyDaeiltec .deco .item:nth-child(3) {background: #148acc; left: 290px; top: 216px;}
#whyDaeiltec .deco .item:nth-child(4) {background: #f7ae1d; left: 0; top: 136px;}
#whyDaeiltec .deco .item:nth-child(5) {background: #00a9bc; top: 160px; right: 238px;}
#whyDaeiltec .deco .item:nth-child(6) {background: #a79ecd; top: 0; right: -60px;}

@media screen and (max-width: 767px) {
  #firstCover1 .title {line-height: 1.2!important;}
  #firstCover1 .title span {line-height: 1;}
  #firstCover1 .logo {display: none;}
  #firstCover1 .cover-pager {display: none;}

  #firstCover2 .page__contents {flex-direction: column;}
  #firstCover2 .contbox {order: 1; width: 100%; padding-top: 100px;}
  #firstCover2 .contbox .title {position: relative; transform: none; font-size: 32px;}
  #firstCover2 .contbox .title .txt2 {margin-left: 0;}
  #firstCover2 .imgbox {order: 0; height: calc(100vh - 380px); min-height: 300px; width: 100%; padding-top: 50px; margin: 0 auto;}
  #firstCover2 .imgbox > .elem1 .line {display: none;}
  #firstCover2 .contbox .logo {display: none;}
  #firstCover2 .cover-pager {display: none;}

  #indexPage .bg_elem {display: none;}
  #indexPage .page__contents {width: 100%;}
  #indexPage .index__tbl_container {flex-direction: column; width: 100%;}
  #indexPage .index__tbl h3 {font-size: 18px;}
  #indexPage .page__sbj::after {height: 160px;}

  #companyIntro .bg {position: static; width: 100%; height: 400px;}
  #companyIntro .content_box {width: 100%; height: auto; padding: 0; margin-bottom: 50px;}
  #companyIntro .content_box .head {flex-direction: column; align-items: flex-start!important; margin-bottom: 50px;}

  #companyOverview .bg {position: static; width: calc(100% + 40px); margin-left: -20px; height: 400px;}
  #companyOverview table {margin: 0 0 30px 0; width: 100%; font-size: 15px; text-align: left;}
  #companyOverview table tr th,
  #companyOverview table tr td,
  #companyOverview table tr {display: block; width: 100%!important; height: auto;}

  #companyBusiness .cont_img {min-width: 700px; width: 1200px; margin-left: 20px;}

  .history_cont {padding-top: 0;}
  .history_cont .block {flex-direction: column; padding-bottom: 50px;}
  .history_cont .block .titlebox {width: 100%!important;}
  .history_cont .block .his_ls {width: 100%; padding: 0;}
  .history_cont .block .his_ls > li .year {width: 88px;}
  #companyHistory .deco {display: none;}
  .history_cont .block:nth-child(3) .thumb {margin-top: 0;}

  .cert_cont {padding: 0;}
  .cert_box {flex-direction: column;}
  .cert_sbj {width: 100%; max-width: 400px; position: relative; right: 0; top: 0;}
  .cert_ls {display: grid; grid-template-columns: repeat(2, 1fr); width: 100%; gap: 20px 10px;}
  .cert_ls > li::before {width: 100%;}
  .cert_ls > li img {width: 100%;}
  .cert_ls li span {padding-right: 0; text-align: center;}

  #blockDevelope1 .page__contents__body .cont1 {position: static; margin-bottom: 50px;}
  #blockDevelope1 .page__contents__body .cont2 {position: static; margin-top: auto;}

  #blockDevelope2 .page__contents__body {position: relative; padding: 40px 20px 0 20px;}
  #blockDevelope2 .page__contents__body .cont {position: relative; right: 0; display: block;}
  #blockDevelope2 .page__contents__body .bg {height: 100%; left: 0; width: 100%;}

  #verify .page__contents__body {flex-direction: column; gap: 20px;}
  #verify .page__contents__desc {text-align: left!important;}

  #merchanization .page__contents__body {margin-top: 0; flex-direction: column; align-items: flex-start; gap: 40px;}
  
  #maintanance .page__contents__head .cont_img {max-width: 100%;margin-left: 0;}
  #maintanance .page__contents__body .bg {height: 70%;}

  #techIntro .page__contents__container {flex-direction: column;}

  .tab_container .tab_btns {justify-content: center; padding: 0 10px;}
  .tab_container .tab_btns .tab_btn {width: 50%; font-size: 16px; height: 36px;}
  .tab_container .tab_contents {flex-direction: column; height: auto; padding: 20px;}
  .tab_container .tab_contents .titlebox {width: 100%; padding: 0;}
  .tab_container .tab_contents .titlebox .thumb {position: static; margin-top: 30px;}
  .tab_container .tab_contents .contbox {padding: 0;}
  .tab_container .tab_contents .contbox section {flex-direction: column;}
  .tab_container .tab_contents .contbox section .cont .title .ico {width: 60px;}

  #techFeature .page__contents__container .page__contents__head {width: 100%; overflow: hidden; padding-bottom: 0;}
  #techFeature .feat_ls li {padding: 20px 0;}
  #techFeature .page__contents__container .page__contents__head .visual {position: static; margin-left: 73px; margin-top: -70px; display: block;}
  #techFeature .page__contents__body {align-items: flex-start;}
  #techFeature .page__contents__body .cont {padding-top: 0;}

  .pg--function nav {margin-top: 0; margin-bottom: 50px; width: 100%;}
  .pg--function nav a {font-size: 18px;}
  .pg--function nav a .ico--circle {width: 18px; height: 18px;}
  .pg--function .contbox {margin-top: 0; flex-direction: column;}

  #structure .page__contents__body .bg {height: 100%;}
  #structure .contbox {flex-direction: column; align-items: flex-start; margin: 0; gap: 30px;}
  #structure .contbox .cont img {margin-bottom: 20px;}
  #structure .contbox .cont .txt .bullet li {font-size: 16px;}
  #structure .contbox .cont3 {display: flex; flex-direction: column; align-items: center; padding: 40px 20px; border-radius: 20px; width: 100%; text-align: center;}

  #application .contbox {flex-direction: column; gap: 20px;}
  #application nav {width: 100%; gap: 10px;}
  #application nav a {height: auto;}
  #application nav a .sbj {font-size: 18px;}
  #application nav a .desc {font-size: 14px;}
  #application nav a.active {width: 100%;}
  #application .imgbox {flex-direction: column; margin: 0;}

  #equipIntro .contbox {align-items: center;}
  #equipIntro .contbox .sbj {text-align: center;}
  #equipIntro .contbox .diagram {width: 100%; flex-wrap: wrap; justify-content: center; margin-top: 60px;}
  #equipIntro .contbox .diagram .deco {display: none;}
  #equipIntro .contbox .diagram .item {width: 280px; height: 280px; margin-top: -30px;}

  #equipIntro .contbox .sbj2 {font-size: 24px;}
  #equipIntro .equip_ls {display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px;}
  #equipIntro .equip_ls .item {width: 100%; padding: 10px 0 30px 0;}

  #prodLineup .page__contents__body .prod_ls_container {flex-direction: column;}
  #prodLineup .page__contents__body .prod_ls {width: 100%; padding-bottom: 40px!important; margin: 0!important;}
  #prodLineup .page__contents__body .prod_ls .thumb {position: static; margin: 30px auto 0 auto; display: block;}
  #prodLineup .page__contents__body .prod_ls ul li a {font-size: 18px;}

  .prod_lnb {position: fixed; bottom: 61px; left: 0; width: 100%; justify-content: flex-start; gap: 20px; flex-wrap: nowrap; padding: 10px 20px; overflow: auto hidden;}
  .prod_lnb a {flex-shrink: 0;}
  .prod_lnb a .thumb {display: none;}

  .pg--product .page__contents__head {margin-bottom: 0; flex-direction: column; align-items: flex-start;}
  .pg--product .prod_tab {font-size: 16px;}
  .pg--product .prod_tab .ico--circle {width: 18px; height: 18px;}
  .pg--product .page__contents__body {padding-bottom: 50px;}
  .prod_overview__thumb {position: static; display: block; margin-left: auto; display: none;}

  .prod_overview__diagram {display: block; height: auto; padding-top: 40px;}
  .prod_overview__diagram .thumb {position: static; left: 0; bottom: 0; transform: none; margin: 0 auto; width: 100%; height: auto; padding: 30px; border-radius: 10px; background: #f9f8f7; margin-bottom: 30px;}
  .prod_overview__diagram .icons {gap: 10px; margin: 0!important;}
  .prod_overview__diagram .icons .bar {display: none;}
  .prod_overview__diagram .icons .group {flex-direction: column; gap: 10px;}
  .prod_overview__diagram .icons .group li {display: flex; flex-direction: column; align-items: center; border: 1px solid #dfdfdf; border-radius: 10px; width: 100%; padding: 20px;}
  .prod_overview__diagram .icons .group li .txt {position: static; margin-top: 10px; text-align: center; font-size: 15px;}
  .prod_overview__diagram .icons .group li .icon {width: 60px; height: 60px; padding: 3px; border-width: 2px;}

  .prod_spec {flex-direction: column; height: auto; padding-top: 20px;}
  .prod_spec .box {width: 100%;}
  .prod_spec .box article {display: block!important;}
  .prod_spec .box article h4 {margin-bottom: 0.5em!important;}
  .prod_spec .app .flex {flex-direction: column;}
  .prod_spec .color .color_ls {flex-direction: column;}
  .prod_spec .spec {padding-top: 20px;}
  .prod_spec .spec .table_wrap {overflow: auto hidden;} 
  .prod_spec .spec table {min-width: 600px; font-size: 14px;} 
  .prod_spec .spec table thead th.empty {background: #f6f6f3;}

  #superGrassBlock .page__contents__head .cert_img {margin: 0; width: 90px;}
  #superGrassBlock .page__contents__body {flex-direction: column;}
  #superGrassBlock .page__contents__body > div {width: 100%!important;}

  #lastCover .page__contents {justify-content: flex-start!important;}
  #lastCover .bg {background-position: left center;}
  #lastCover .txtbox .desc {color: #fff;}
  #lastCover .diagram {position: static; display: block; margin: 50px auto 0 auto;}

  #lastPage .page__contents {gap: 100px 0;}
  #lastPage .page__contents .logo {width: 200px;}
  #lastPage .page__contents address {font-size: 14px;}
  #lastPage .page__contents address ul li {flex-direction: column; padding: 10px 0;}
  #lastPage .page__contents address ul li .val {padding: 0 10px;}
  #lastPage .page__contents address ul li .val .item {display: block; margin: 0;}

  #whyDaeiltec .reason {margin-top: 50px; flex-direction: column;}
  #whyDaeiltec .deco {display: none;}
}
@media screen and (max-width: 499px) {
  #equipIntro .equip_ls {width: 100%; grid-template-columns: repeat(1, 1fr);}
  #equipIntro .equip_ls .item .thumb {width: 100%;}
}