/* color */
:root {
   --bs-lemon: #ffffcc;
   --bs-haccblue: #0086c0;
   --bs-haccblue-rgb: 0, 134, 192;
   --bs-hacc: #6b9bb2;
   --bs-hacc-bg-subtle: #e8f5fa;
   --bs-hacc-border-subtle: #b1cad6;
}

.u_skip {
   position: relative;
}

.u_skip a {
   position: absolute;
   top: -30px;
   left: 0;
   width: 138px;
   border: 1px solid #4ec53d;
   background: #333;
   text-align: center;
}

.u_skip a:active,
.u_skip a:focus {
   top: 0;
   z-index: 1000;
}

.u_skip span {
   display: inline-block;
   padding: 2px 6px 0 0;
   color: #fff;
   letter-spacing: -1px;
   font-size: 13px;
   line-height: 26px;
}

button,
input[type='button'] {
   margin: 0;
   padding: 0;
   border: none;
   background: none;
   font: inherit;
   font-size: 1em;
}

/* Slider */
.slick-slider {
   box-sizing: border-box;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   -webkit-touch-callout: none;
   -khtml-user-select: none;
   -ms-touch-action: pan-y;
   touch-action: pan-y;
   -webkit-tap-highlight-color: transparent;
}

.slick-list {
   overflow: hidden;
   margin: 0;
   padding: 0;
}

.slick-list.dragging {
   cursor: pointer;
   /* cursor: hand; */
}

.slick-slider .slick-list,
.slick-slider .slick-track {
   -webkit-transform: translate3d(0, 0, 0);
   -moz-transform: translate3d(0, 0, 0);
   -ms-transform: translate3d(0, 0, 0);
   -o-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
}

.slick-track {
   top: 0;
   left: 0;
}

.slick-track:after,
.slick-track:before {
   display: table;
   content: '';
}

.slick-track:after {
   clear: both;
}

.slick-slide {
   display: none;
   float: left;
   height: 100%;
   min-height: 1px;
   box-shadow: none;
   /* border-color: none; */
   /* color: none; */
   background: 0 0;
   border: none;
}

[dir='rtl'] .slick-slide {
   float: right;
}

.slick-slide img {
   display: block;
   max-width: 100%;
}

.slick-slide.slick-loading img {
   display: none;
}

.slick-slide.dragging img {
   pointer-events: none;
}

.slick-initialized .slick-slide {
   display: block;
}

.slick-vertical .slick-slide {
   display: block;
   height: auto;
   border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
   display: none;
}

::selection {
   background-color: #0075bc;
   color: #fff;
   text-shadow: none;
}

.slick-arrow {
   white-space: nowrap;
   overflow: hidden;
   text-indent: -999px;
   display: block;
   z-index: 100;
}

.item .table {
   width: 100%;
   height: 100%;
   display: flex;
   justify-content: flex-start;
   padding: 20vh 0 0 0;   
}

.item .vertical {
   text-align: start;
   display: table-cell;
   vertical-align: middle;
}
@media (max-width: 500px) {
   .item .vertical {
      display: table-cell;
      vertical-align: 0%;
   }
}

#main_visual {
   position: relative;
   overflow: hidden;
   text-align: center;
   color: #fff;
   height: 950px;
   /* height: 100vh; */
}

#main_visual .in {
   position: relative;
   /* height: 100vh; */
}

#main_visual .item {
   /* height: 100vh; */
   height: 950px;
   min-height: 300px;
   background: no-repeat center center scroll;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}

#main_visual .item.slick-active h2 {
   /* animation:fadeInLeft 1s both 1s; */
   animation:fadeInDown 1s both 1s;
}
#main_visual .item h2.slide_in_text {
   /* font-size: 54px; */
   font-weight: 700;
   color: #fff;
   white-space: pre-line;
   margin-top: 150px;   
   word-break: keep-all;
   line-height: 1.5;
}
@media (max-width: 576px){
   #main_visual .item h2.slide_in_text{
      margin-top: 190px;
   }
}
@media (min-width: 920px) {
   #main_visual .item h2.slide_in_text {
      white-space: normal;
   }
}
#main_visual .item h2.slide_in_text span {
   color: #0070b2;
}

#main_visual .slick-arrow {
   position: absolute;
   width: 71px;
   height: 71px;
   background: url('') center center no-repeat;
   width: 50px;
   height: 50px;
   z-index: 1;
   /* left: 50%; */
   top: 50%;
   margin-top: -23px;
   background-size: 100%;
}

#main_visual .slick-prev {
   background-image: url('../images/slide_main_pre.png');
   /* margin-left: -700px; */
   left: 3%;
   display: block;
}

#main_visual .slick-next {
   background-image: url('../images/slide_main_next.png');
   /* margin-left: 629px; */
   right: 3%;
   display: block;
}

/* #main_visual .container:has(.contols) {
   left:0;
   top:0;
} */

#main_visual .contols {
   /* left: 46%; */
   top: 520px;
   width: 120px;
   height: 24px;
   text-align: center;
   padding-top: 0.25rem;
}

@media (max-width: 576px){
   .item .table {
      padding: 70px 0 0 15px;
   }
   #main_visual .contols{
      top: 450px;
      left: 12px;
   }
   #main_visual .slick-prev {
      display: none !important;
   }
   #main_visual .slick-next {
      display: none !important;
   }
}


#main_visual .contols > * {
   display: inline-block;
}

#main_visual .dots_w {
   display: inline-block;
}

#main_visual .slick-dots {
   margin-bottom: 0;
}

#main_visual .slick-dots li {
   display: inline-block;
   margin: 0 3px;
}

#main_visual .slick-dots button {
   width: 16px;
   height: 16px;
   text-indent: -999px;
   white-space: nowrap;
   overflow: hidden;
   background: url('../images/pager_main.png') no-repeat center center;
}

#main_visual .slick-active button {
   background: url('../images/pager_main_s.png') no-repeat center center;
}

#main_visual .ap {
   width: 16px;
   height: 16px;
   margin-left: 3px;
   cursor: pointer;
}

#main_visual .btns {
   max-width: 870px;
   margin: -60px auto 0;
   position: relative;
   color: #fff;
   font-size: 1.2em;
   font-weight: 700;
   line-height: 1.35;
   background: #e91562;
}

#main_visual .btns a {
   display: block;
   padding: 40px 0 40px 140px;
}


/* main .btn */
.slide_bottom_wrap a.btn,
#main_nav_01 a.btn,
#main_nav_02 a.btn {
   width: fit-content;
   white-space: nowrap;
   font-size: 0.875rem !important;
   font-weight: 700;
}

@media (min-width: 960px) {
   .slide_bottom_wrap a.btn,
   #main_nav_01 a.btn,
   #main_nav_02 a.btn {
      font-size: 1rem !important;
   }
}

/* main .btn-light */
#main_nav_01 a.btn-light,
#main_nav_02 a.btn-light {
   margin: 0.5rem 0.5rem 0 0;
   padding: 0.375rem 0.5rem 0.375rem 1rem !important;
}

#main_nav_01 a.btn-light:hover,
#main_nav_02 a.btn-light:hover {
   background-color: var(--bs-lemon);
   border-color: var(--bs-lemon);
}

/* 메인 슬라이드 하단 S */
#main_visual .main_bottom_area {
   width: 100%;
   border-top: 1px solid #fff;
   backdrop-filter: blur(20px);
}
#main_visual .main_bottom_area .wrap div {
   height: 150px;
}
#main_visual .main_bottom_area .wrap .ex_border {
   /* height: 150px; */
   border-right: 1px solid #fff;
}

#main_visual .wrap a {
   font-size: 16px;
   color: #fff;
   text-align: start;
}
#main_visual .wrap a span {
   font-size: 32px;
   color: #fff;
   font-weight: 900;
}
#main_visual .wrap a i {
   font-size: 45px;
   color: #fff;
   font-weight: 400;
}

@media (max-width: 768px) {
   #main_visual .main_bottom_area {
      width: 100%;
      border-top: 1px solid #fff;
      backdrop-filter: blur(20px);
   }
   #main_visual .main_bottom_area .wrap .right{
      border-top: 1px solid #fff;
   }
   #main_visual .main_bottom_area .wrap div {
      height: 150px;
   }
   #main_visual .main_bottom_area .wrap .ex_border {
      height: 150px;
      border-right: none;
   }
   #main_visual .wrap a span {
      font-size: 28px;
   }   
}

/* About Products S */
.leftArea_ex {
   height: 504px;
   position: relative;
}
@media (max-width: 576px) {
   .leftArea_ex {
      height: 304px;
   }
}
.about_category {
   font-size: 18px;
   color: #333333;
   font-weight: 700;
   margin-bottom: 30px;
}
.about_category span {
   color: #0070b2;
}
.about_title {
   font-size: 30px;
   color: #333333;
   font-weight: 700;
   line-height: 50px;
}

#post-slider-nav {
   position: absolute;
   bottom: 0;
   display: flex;
}
#post-slider-nav a {
   display: flex;
   width: 60px;
   height: 60px;
   border: 1px solid #bdbdbd;
   border-radius: 25%;
   justify-content: center;
   align-items: center;
   margin-right: 10px;
}
#post-slider-nav a:hover {
   background-color: #0070b2;
}
#post-slider-nav a i {
   font-size: 30px;
   color: #bdbdbd;
}
#post-slider-nav a:hover i {
   color: #fff;
}


.post-slider-wrap,
.testimonial-slider-wrap {
   position: relative;
}
.post-slider-wrap .tns-inner,
.testimonial-slider-wrap .tns-inner {
   padding-bottom: 0px;
}
.post-slider-wrap .tns-nav,
.testimonial-slider-wrap .tns-nav {
   position: absolute;
   left: 50%;
   z-index: 9;
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   transform: translateX(-50%);
   bottom: 20px;
}
.post-slider-wrap .tns-nav button,
.testimonial-slider-wrap .tns-nav button {
   background: none;
   border: none;
   margin: 3px;
   height: 7px;
   position: relative;
}
.post-slider-wrap .tns-nav button:active,
.post-slider-wrap .tns-nav button:focus,
.testimonial-slider-wrap .tns-nav button:active,
.testimonial-slider-wrap .tns-nav button:focus {
   outline: none;
}
.post-slider-wrap .tns-nav button:before,
.testimonial-slider-wrap .tns-nav button:before {
   position: absolute;
   content: '';
   width: 7px;
   height: 7px;
   display: inline-block;
   border-radius: 50%;
   background-color: rgba(0, 0, 0, 0.5) !important;
   -webkit-transition: 0.3s all ease;
   -o-transition: 0.3s all ease;
   transition: 0.3s all ease;
}
.post-slider-wrap .tns-nav button.tns-nav-active:before,
.testimonial-slider-wrap .tns-nav button.tns-nav-active:before {
   background-color: #000 !important;
   height: 7px;
}

/* big slide S */
.leftArea_ex2 {
   min-height: 300px;
   position: relative;
}
@media (max-width: 1399px) {
   .leftArea_ex2 {
      margin-bottom: 20px;
   }
}
#post-slider-nav2 {
   position: absolute;
   bottom: 0px;
   display: flex;
   height: 60px;
}
#post-slider-nav2 a {
   display: flex;
   width: 60px;
   height: 60px;
   border: 1px solid #bdbdbd;
   border-radius: 25%;
   justify-content: center;
   align-items: center;
   margin-right: 10px;
}
#post-slider-nav2 a:hover {
   background-color: #0070b2;
}
#post-slider-nav2 a i {
   font-size: 30px;
   color: #bdbdbd;
}
#post-slider-nav2 a:hover i {
   color: #fff;
}
.post-slider-wrap2 .post-slider2 .card img{
   width: 100%;
}
.post-slider-wrap2,
.testimonial-slider-wrap {
   position: relative;
}
.post-slider-wrap2 .tns-inner,
.testimonial-slider-wrap .tns-inner {
   padding-bottom: 0px;
}
.post-slider-wrap2 .tns-nav,
.testimonial-slider-wrap .tns-nav {
   position: absolute;
   left: 50%;
   z-index: 9;
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   transform: translateX(-50%);
   bottom: 20px;
}
.post-slider-wrap2 .tns-nav button,
.testimonial-slider-wrap .tns-nav button {
   background: none;
   border: none;
   margin: 3px;
   height: 7px;
   position: relative;
}
.post-slider-wrap2 .tns-nav button:active,
.post-slider-wrap2 .tns-nav button:focus,
.testimonial-slider-wrap .tns-nav button:active,
.testimonial-slider-wrap .tns-nav button:focus {
   outline: none;
}
.post-slider-wrap2 .tns-nav button:before,
.testimonial-slider-wrap .tns-nav button:before {
   position: absolute;
   content: '';
   width: 7px;
   height: 7px;
   display: inline-block;
   border-radius: 50%;
   background-color: rgba(0, 0, 0, 0.5) !important;
   -webkit-transition: 0.3s all ease;
   -o-transition: 0.3s all ease;
   transition: 0.3s all ease;
}
.post-slider-wrap2 .tns-nav button.tns-nav-active:before,
.testimonial-slider-wrap .tns-nav button.tns-nav-active:before {
   background-color: #000 !important;
   height: 7px;
}
/* big slide E */

/* About Products E */

/* About Business S */
.box3Wrap .border-div {
   display: flex;
   justify-content: center;
   align-items: center;
   width: 213px;
   height: 213px;
   background: linear-gradient(#007cb5, #00b0c1);
   border-radius: 50%;
}
.box3Wrap .content-div {
   display: flex;
   justify-content: center;
   align-items: center;
   width: 202px;
   height: 202px;
   font-size: 30px;
   font-weight: 700;
   color: #333333;
   border-radius: 50%;
   background-color: #fff;
}
.box3Wrap .dot {
   display: flex;
   justify-content: center;
   align-items: center;
   width: 107px;
   height: 213px;
}
.box3Wrap .dot .line {
   width: 100%;
   height: 1px;
   border: 1px dashed #000;
}

@media (max-width: 992px) {
   .box3Wrap .border-div {
      width: 113px;
      height: 113px;
   }
   .box3Wrap .content-div {
      width: 102px;
      height: 102px;
      font-size: 16px;
   }
   .box3Wrap .dot {
      width: 57px;
      height: 113px;
   }
}
/* About Business E */

/* About Applying Field S */
.box3Wrap .box-div {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   /* width: 314px;
   height: 160px; */
   background-color: #f8f8f9;
   /* margin-right: 10px; */
   text-align: center;
}
.box3Wrap .box-div .title {
   font-size: 16px;
   color: #333333;
   font-weight: 500;
   padding: 0 20px;
   word-break: keep-all;
}
@media (max-width: 800px) {
   .box3Wrap .box-div {
      /* width: 200px; */
      /* height: 150px; */
      /* margin-right: 5px; */
   }
   .box3Wrap .box-div .title {
      font-size: 12px;
   }
}
/* About Applying Field E */

/* Our  Performance S */
.about_title span {
   color: #0070b2;
}
.box3Wrap .banner-div {
   display: flex;
   justify-content: center;
   align-items: center;
   /* width: 314px;
   height: 90px;
   margin-right: 10px; */
   border: 1px solid #e4e4e4;
}
@media (max-width: 800px) {
   .box3Wrap .banner-div {
      /* width: 114px; */
      height: 60px;
      margin-right: 5px;
   }
}

/* Our  Performance E */

/* Our Certification & Patent S */
#patent {
   background-color: #f8f8f9;
}
#patent h5 {
   font-size: 18px;
   font-weight: 700;
   color: #333333;
   text-align: center;
}
#patent h5 span {
   color: #0070b2;
}
#patent h1 {
   font-size: 42px;
   font-weight: 700;
   color: #333333;
   text-align: center;
}
@media (max-width:991px){
   #patent h1{
      font-size: 30px;
   }
}
#patent h1 span {
   color: #0070b2;
}
#patent p {
   font-size: 16px;
   color: #333333;
   text-align: center;
}

#patent .slick_banner .slick-slide:not(.slick-active) {
   opacity: 0.3;
}
/* Our Certification & Patent E */

