.section__togglebar {
  padding: 40px 0;
}

.togglebar__container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 50%;
  min-width: 520px;
  margin: 0 auto;
  border-bottom: 1px solid #EDEEF0;
  padding: 0 20px 10px 20px;
}

@media screen and (max-width: 768px) {
  .togglebar__container {
    width: 100%;
    min-width: unset;
    padding: 0 5px 10px 5px;
  }
}

.togglebar__item--link {
  font-size: 20px;
  color: #A7A7A7;
  padding: 0 20px 2.5px 20px;
}

.togglebar__item--link:hover {
  color: #5CC1DF;
}

@media screen and (max-width: 768px) {
  .togglebar__item--link {
    font-size: 12px;
    padding: 0 5px 6.5px 5px;
  }
}

.toogglebar__action--active {
  color: black;
  border-bottom: 2.5px solid #5CC1DF;
}

.toogglebar__action--active:hover {
  color: black;
}

.selected {
  display: block !important;
}

.section__function {
  display: none;
}

.section__unloggedin {
  height: 80vh;
}

@media screen and (max-width: 768px) {
  .section__unloggedin {
    height: 100%;
  }
}

.function__container--content {
  width: 60%;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media screen and (max-width: 768px) {
  .function__container--content {
    width: 90%;
  }
}

.function__item--list {
  width: 230px;
  min-height: 150px;
  margin: 20px 10px;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .function__item--list {
    min-height: unset;
  }
}

.function__icon--list {
  color: #5CC1DF;
  font-size: 40px;
  margin-bottom: 10px;
}

@media screen and (max-width: 768px) {
  .function__icon--list {
    font-size: 30px;
  }
}

.function__text--list {
  margin-bottom: 10px;
}

.function__text--detail {
  color: #747474;
  text-align: left;
}

@media screen and (max-width: 768px) {
  .function__text--detail {
    width: 80%;
    margin: 0 auto;
  }
}

.function__container--text {
  width: 60%;
  margin: 0 auto;
}

@media screen and (max-width: 768px) {
  .function__container--text {
    width: 90%;
  }
}

.function__wrapper--text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 60px;
}

@media screen and (max-width: 768px) {
  .function__wrapper--text {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-bottom: 40px;
  }
}

.function__wrapper--right {
  margin-right: 20px;
  text-align: center;
  width: 40%;
}

@media screen and (max-width: 768px) {
  .function__wrapper--right {
    margin-right: unset;
    width: 100%;
  }
}

.function__wrapper--left {
  width: 60%;
}

@media screen and (max-width: 768px) {
  .function__wrapper--left {
    width: 100%;
    text-align: left;
  }
}

@media screen and (max-width: 768px) {
  .funtcion__text-short {
    text-align: center;
  }
}
/*# sourceMappingURL=function.css.map */