@charset "UTF-8";
/*============================
#top
============================*/
#top #main {}
#top .container {}
#top .inner {
}
#top h2.heading {
    font-size: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 4em;
    background: #FFF;
    margin-bottom: 2em;
}
#top .inner p {
    font-size: 1.25rem;
    letter-spacing: 0.1em;
}
#top .inner p a {}
@media screen and (max-width:768px) {
    #top #main {}
    #top .container {}
    #top .inner {}
    #top h2.heading {
    font-size: 7vw;
    margin-bottom: 1em;
}
    #top .inner p {
    font-size: 1rem;
}
    #top .inner p a {}
}
/*============================
#hero
============================*/
#hero {
    background: rgb(245,250,255);
    background: linear-gradient(0deg, rgba(245,250,255,1) 0%, rgba(255,255,255,1) 100%);
    /* padding: 100px 0 50px; */
}
#hero .inner {
    max-width: 1400px;
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    padding: 40px 0px 0 20px;
}
#hero .inner .hero-text {
    width: 60%;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
}
#hero .inner .hero-text h2 {font-size: 3rem;line-height: 1.4;letter-spacing: 0.1em;margin: 0 0 0.25em;}
#hero .inner .hero-text h3 {
    margin-bottom: 1em;
    letter-spacing: 0.1em;
    font-size: 1.25rem;
}
#hero .inner .hero-text .action {}
#hero .inner .hero-text .action a.button {
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.25);
}
#hero .inner .hero-text .action a.button {
    width: 100%;
    max-width: 450px;
    padding: 1em 0.5em;
}
#hero .inner .hero-text .action a.button.dignosis {
    padding: 1em 1em;
}

#hero .inner .hero-text .action a.button.registration {
    background: rgb(255,165,2);
    background: linear-gradient(0deg, rgba(255,165,2,1) 0%, rgba(255,200,55,1) 100%);
    color: #333;
    margin-bottom: 20px;
}

#hero .inner .hero-text .action a.button.login {}
#hero .inner .hero-text .action a.button span {}
#hero .inner .hero-text .action a.button span i {
    margin-right: 0.5em;
}
#hero .inner .hero-text .action a.button span i img {}
#hero .inner .hero-image {
    width: 40%;
    text-align: right;
    padding-left: 20px;
}
#hero .inner .hero-image img {}
@media screen and (max-width:768px) {
    #hero {}
    #hero .inner {
    display: block;
    padding: 80px 0 0 0;
}
    #hero .inner .hero-text {
    width: 100%;
    padding: 0 1em;
}
    #hero .inner .hero-text h2 {
    font-size: 6.8vw;
    padding: 2em 0 1em;
}
    #hero .inner .hero-text h3 {
    font-size: 4vw;
}
    #hero .inner .hero-text .action {}
    #hero .inner .hero-text .action a.button {
}
    #hero .inner .hero-text .action a.button span {}
    #hero .inner .hero-text .action a.button span i {}
    #hero .inner .hero-text .action a.button span i img {}
    #hero .inner .hero-image {
    width: 100%;
    overflow: hidden;
}
    #hero .inner .hero-image img {
    width: 100%;
    margin-top: -10%;
    margin-right: -10%;
}
}
/*============================
#service
============================*/
#service {
    background: url(../img/bg-about.jpg) no-repeat center center;
    background-size: cover;
    padding: 0 0 100px;
}
#service h2.heading {
}
#service .inner {
}
#service .inner p {
}
#service .inner ul {display: flex;flex-wrap: wrap;justify-content: space-between;margin: 60px 0;}
#service .inner ul li {width: 25%;}
#service .inner ul li span {aspect-ratio: 1/1;display: flex;align-items: center;justify-content: center;background: rgb(255,255,255);background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(245,250,255,1) 100%);border-radius: 50%;box-shadow: 0px 3px 6px rgba(0,0,0,0.15);font-weight: 600;text-align: center;line-height: 2.5;letter-spacing: 0;}
#service .inner picture {display: block;width: 100%;}
#service .inner picture source {
}
#service .inner picture img {width: 100%;}


@media screen and (max-width:768px) {
#service {padding: 0 0 50px;}
#service h2.heading {
}
#service .inner {
}
#service .inner p {
}
#service .inner ul {margin: 2em 0;}
#service .inner ul li {
    width: 100%;
    margin: 0 0 20px;
    font-size: 1.1rem;
}
#service .inner ul li span {aspect-ratio: auto;border-radius: 4px;line-height: 1.8;padding: 0.5em 1em;word-break: auto-phrase;}

#service .inner ul li span br {
    display: none;
}
#service .inner picture {
}
#service .inner picture source {
}
#service .inner picture img {
}}

/*============================
#flow
============================*/
#flow {background: url(../img/bg-flow.jpg) no-repeat center center;background-size: cover;padding: 0 0 100px;}
#flow h2.heading {
}
#flow .inner {
}
#flow .inner .flow-slider {
}
#flow .inner .flow-slider .flow-item {padding: 0 40px;}
#flow .inner .flow-slider .flow-item h3 {text-align: center;margin: 0 0 1em;font-weight: 600;}
#flow .inner .flow-slider .flow-item figure {
}
#flow .inner .flow-slider .flow-item figure img {margin: 0 auto 20px;width: 60%;}
#flow .inner .flow-slider .flow-item figure figcaption {font-size: 1rem;line-height: 1.6;}

@media screen and (max-width:768px) {
#flow {padding: 0 0 50px;}
#flow h2.heading {
}
#flow .inner {
}
#flow .inner .flow-slider {
}
#flow .inner .flow-slider .flow-item {padding: 0 1em;}
#flow .inner .flow-slider .flow-item h3 {
}
#flow .inner .flow-slider .flow-item figure {
}
#flow .inner .flow-slider .flow-item figure img {width: 80%;}
#flow .inner .flow-slider .flow-item figure figcaption {
}

}


/*============================
#features
============================*/
#features {background: url(../img/bg-flow.jpg) no-repeat center center;background-size: cover;padding: 0 0 100px;}
#features h2.heading {
}
#features .inner {
}
#features .inner p {
}
#features .inner .features-slider {
}
#features .inner .features-slider .features-item {padding: 0 40px;}
#features .inner .features-slider .features-item figure {
}
#features .inner .features-slider .features-item figure img {margin: 0 auto;width: 80%;}
#features .inner .features-slider .features-item figure figcaption {font-size: 1rem;line-height: 1.6;text-align: center;margin-top: -1em;}

@media screen and (max-width:768px) {
#features {padding: 0 0 50px;}
#features h2.heading {
}
#features .inner {
}
#features .inner p {
}
#features .inner .features-slider {
}
#features .inner .features-slider .features-item {padding: 0 1em;}
#features .inner .features-slider .features-item figure {
}
#features .inner .features-slider .features-item figure img {width: 100%;}
#features .inner .features-slider .features-item figure figcaption {
}
}


/*============================
#dignosis
============================*/
#dignosis {
}
#dignosis h2 {
    background: rgb(255, 116, 140);
    background: linear-gradient(180deg, rgba(255, 116, 140, 1) 0%, rgba(255, 154, 162, 1) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 4em;
    color: #FFF;
    margin-bottom: 2em;
}
#dignosis h2 span {
}
#dignosis .inner {
}
#dignosis .inner p {margin-bottom: 2em;}
#dignosis .inner .action {
    text-align: center;
    margin-bottom: 5em;
    display: flex;
    align-items: stretch;
    justify-content: center;
}
#dignosis .inner .action a.button {
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.25);
    width: calc(50% - 1em);
    margin: 0 auto;
    font-weight: 400;
}
#dignosis .inner .action a.button.registration {
    background: rgb(255, 165, 2);
    background: linear-gradient(0deg, rgba(255, 165, 2, 1) 0%, rgba(255, 200, 55, 1) 100%);
    color: #333;
}

#dignosis .inner .action a.button span {
}
#dignosis .inner .action a.button span i {margin-right: 0.5em;}
#dignosis .inner .action a.button span i img {
}
#dignosis .inner .action a.button span small {
    font-size: 80%;
}

@media screen and (max-width:768px) {
#dignosis {padding: 0 0 50px;}
#dignosis h2 {font-size: 6vw;margin-bottom: 1em;}
#dignosis h2 span {
}
#dignosis .inner {
}
#dignosis .inner p {
}
#dignosis .inner .action {display: block;margin-bottom: 0;}
#dignosis .inner .action a.button {width: 100%;margin: 0 0 20px;}
#dignosis .inner .action a.button span {
}
#dignosis .inner .action a.button span i {
}
#dignosis .inner .action a.button span i img {
}
#dignosis .inner .action a.button span small {
}

}

/*============================
sample-report
============================*/
.sample-report {width: 100%;text-align: center;padding: 2em 0 0;}
.sample-report a#open-report {
  display: inline-block;
  padding: 1.5em 1em;
  position: relative;
  color: #FFF;
  line-height: 1;
  font-weight: bold;
  font-size: 1.6rem;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.25);
  width: 80%;
  background: rgb(255, 165, 2);
  background: linear-gradient(0deg, rgba(255, 165, 2, 1) 0%, rgba(255, 200, 55, 1) 100%);
}
.sample-report a#open-report span {
  display: block;
  text-align: center;
}
.sample-report a#open-report span i {position: absolute;right: -5%;top: -20%;width: 160px;}
.sample-report a#open-report span i img {
}

#lightbox {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
}

#lightbox .lb-bg {
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.75);
}
.lb-content {
  position: absolute;
  width: fit-content;
  height: fit-content;
  max-width: 90%;
  margin: auto;
  padding: 20px 24px 30px;
  background: #fff;
  box-shadow: 0 15px 40px rgba(0,0,0,0.25);
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.lb-close {
  position: absolute;
  top: 0;
  right: 8px;
  background: none;
  border: none;
  font-size: 72px;
  cursor: pointer;
}

.lb-inner {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 20px;
}

.lb-prev, .lb-next {
  border: none;
  padding: 12px 16px;
  font-size: 20px;
  border-radius: 6px;
  cursor: pointer;
  background: transparent;
}
.lb-prev:hover,
.lb-next:hover {
  background: #ddd;
}
.lb-slide-wrapper {
  flex: 1;
  text-align: center;
  overflow: hidden;
}

.lb-slides li {
  display: none;
  opacity: 0;
  transition: opacity .4s ease;
}

.lb-slides li.active {
  display: block;
  opacity: 1;
}

.lb-slides img {
  max-width: 100%;
  max-height: 70vh;
}
.lb-counter {
  margin-top: 6px;
  text-align: center;
  font-size: 14px;
}
.lb-thumbs ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  margin-top: 14px;
  padding: 0;
  list-style: none;
}

.lb-thumbs li {
  border: 2px solid transparent;
  cursor: pointer;
  border-radius: 6px;
  overflow: hidden;
}

.lb-thumbs li.active {
  border-color: #007bff;
}

.lb-thumbs img {
  width: 70px;
  height: 70px;
  object-fit: cover;
}
@media (max-width: 768px) {
.sample-report a#open-report {font-size: 1em;width: 100%;padding: 1em;text-align: left;}
.sample-report a#open-report span {/* text-align: left; */width: 12em;}
.sample-report a#open-report span i {width: 30%;right: 0;top: -25%;}
  .lb-content {
  padding: 10px;
  width: 100%;
  }

.lb-inner {
    gap: 4px;
}
  .lb-thumbs {
    display: none;
  }
  .lb-close {
    font-size: 30px;
    right: 0;
}
  .lb-prev, .lb-next {
    padding: 0;
}






}