/*  Box Sizing */
/*  Text Truncate */
/* TRANSITION */
/* TRANSFORM */
/* ANIMATION */
/* GRADIENT */
/* -------------ELEMENT----------- */
.box-shadow { box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); }

/* -------------KV---------------- */
#kv { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; margin-top: 70px; position: relative; }
#kv figure { width: 100%; height: 0; padding-bottom: 44.4444%; position: relative; }
#kv figure:before { content: ''; display: block; width: 100%; height: 100%; position: absolute; bottom: 0; right: 0; background-image: #21666b; background-image: -webkit-linear-gradient(legacy-direction(90deg), #21666b, #00a1c8); background-image: linear-gradient(90deg, #21666b, #00a1c8); -webkit-animation-delay: 0s; -webkit-animation-duration: 4s; -webkit-animation-name: colorrun; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; -webkit-animation-fill-mode: forwards; -moz-animation-delay: 0s; -moz-animation-duration: 4s; -moz-animation-name: colorrun; -moz-animation-timing-function: linear; -moz-animation-iteration-count: infinite; -moz-animation-fill-mode: forwards; -o-animation-delay: 0s; -o-animation-duration: 4s; -o-animation-name: colorrun; -o-animation-timing-function: linear; -o-animation-iteration-count: infinite; -o-animation-fill-mode: forwards; animation-delay: 0s; animation-duration: 4s; animation-name: colorrun; animation-timing-function: linear; animation-iteration-count: infinite; animation-fill-mode: forwards; }
#kv figure img { position: absolute; bottom: 0; right: 0; }
#kv figure img.kv-bg { width: 100%; }
#kv figure img.kv-element { width: 50%; }
#kv .container { width: 90%; position: absolute; top: 45%; right: 0; bottom: 0; left: 0; margin: auto; -moz-transform: translate(0, -50%); -o-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); z-index: 2; }
#kv .logo-icon { max-width: 90px; }
#kv h2 { max-width: 80%; }
#kv .btn { margin-top: 4rem; }

/* -------------PRODUCT----------- */
#product { padding: 5.5rem 0; }
#product .btn { margin: 1.5rem 0 0; }

/* -------------ABOUT------------- */
#about { padding: 5.5rem 0; position: relative; }
#about .bg { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
#about .bg div { height: 100%; background-repeat: no-repeat; background-position: right bottom; }
#about .bg .left { background-image: url(/assets/img/index/about-l-bg.png); background-size: 45%; }
#about #particles-about { width: 30%; }
#about .container { padding: 2rem 0; position: relative; z-index: 2; }
#about .container .left { padding-right: 3rem; }
#about .container .left .btn { margin-top: 3rem; }
#about .container .right { padding-left: 3.5rem; }
#about .container .right h4 { font-size: 1.875rem; margin-bottom: 0; }
#about .container .right p { margin-bottom: 1.5rem; }

/* -------------NEWS-------------- */
#news { padding: 5rem 0; position: relative; }
#news .btn { margin-top: 3rem; }

/* -------------SERVICE----------- */
#service .bg { padding: 6rem 0 12rem; background: url(/assets/img/index/service-bg.jpg) 0 0 no-repeat; background-size: cover; background-attachment: fixed; }
#service .bg h4 { font-size: 1.55rem; line-height: 1.875; letter-spacing: .08em; }
#service .bg-light-grey { padding-bottom: 5rem; }
#service li { padding: 0 1.5rem; margin-top: -10%; }
#service figure { width: 75%; height: 0; padding-bottom: 75%; border-radius: 50%; background: white; border: 1px solid #3B8585; box-shadow: 0 0 5px rgba(0, 0, 0, 0.15), 0 0 0 6px rgba(124, 184, 146, 0.25); margin: 0 auto 2rem; position: relative; }
#service figure img { width: 50%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; }
#service h6 { min-height: 2em; }
#service .line-3 { line-height: 1.75; height: 5rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; margin: .5rem 0 1rem; }

/* -------------PARTNERS---------- */
#partners { padding: 5rem 0 5.5rem; }
#partners ul { margin-top: 1.5rem; }
#partners li { margin: 1.75rem 0; }
#partners a { display: block; padding: 0 2rem; -moz-transition: transform 0.4s ease; -o-transition: transform 0.4s ease; -webkit-transition: transform 0.4s ease; transition: transform 0.4s ease; }
#partners a:hover { -moz-transform: translate(0, -2px); -o-transform: translate(0, -2px); -ms-transform: translate(0, -2px); -webkit-transform: translate(0, -2px); transform: translate(0, -2px); }
#partners a:active { -moz-transform: translate(0, 0) scale(0.98, 0.98); -o-transform: translate(0, 0) scale(0.98, 0.98); -ms-transform: translate(0, 0) scale(0.98, 0.98); -webkit-transform: translate(0, 0) scale(0.98, 0.98); transform: translate(0, 0) scale(0.98, 0.98); }
#partners a img { margin: 0 auto; }

/* -------------RWD--------------- */
@media screen and (max-width: 1440px) { #kv .logo-icon { max-width: 85px; }
  #about .bg .left { background-size: 57%; }
  #about .bg .right { background-size: 65%; } }
@media screen and (max-width: 1280px) { #kv { margin-top: 42px; }
  #kv .logo-icon { max-width: 60px; }
  #kv .btn { margin-top: 3rem; }
  #product, #news, #partners { padding-top: 4.5rem; }
  #about { padding: 3rem 0; } }
@media screen and (max-width: 1023px) { #kv figure { padding-bottom: 55%; } }
@media screen and (max-width: 768px) { #kv figure { padding-bottom: 80%; }
  #kv h2 { max-width: none; }
  #service .bg { padding: 4rem 0 10rem; }
  #service li { padding: 0 .5rem; margin-top: -15%; }
  #partners li a { padding: 0 1rem; } }
@media screen and (max-width: 620px) { #kv { position: relative; }
  #kv figure { width: 100%; height: 100%; padding-bottom: 0; position: absolute; top: 0; left: 0; }
  #kv .container { padding: 4rem 0 6rem; position: relative; top: 0; -moz-transform: translate(0, 0); -o-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); }
  #about { padding: 0; }
  #about .bg { display: none; }
  #about .container { width: 100%; max-width: none; padding: 0; }
  #about .container .col50 { width: 100%; padding: 4rem 5%; }
  #about .container .left { background: #3B8585 url(/assets/img/index/about-l-bg.png) right bottom no-repeat; background-size: 55%; }
  #about .container .right { padding: 2rem 5%; }
  #about .container #particles-about { width: 80%; }
  #service .bg-light-grey { padding-bottom: 2rem; }
  #service li { width: 100%; max-width: 300px; padding: 0; margin: 0 auto 2rem; }
  #service li:first-child { margin-top: -20%; }
  #service figure { width: 50%; padding-bottom: 50%; }
  #service h6 { min-height: 0; }
  #service .line-3 { font-size: 14px; height: 5.875rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
  #partners li { width: 33.3333%; } }
@media screen and (max-width: 480px) { #kv .container { padding: 2rem 0 3rem; }
  #kv .btn { margin-top: 2.5em; }
  #partners li { width: 50%; } }

/*# sourceMappingURL=index.css.map */