.main-header {
  min-height: 191px; }
  @media only print, only screen and (min-width: 48.063em) {
    .main-header.is-sticky .sticker {
      display: none; } }

.main-menu {
  display: none; }

.main-banner:before {
  padding-bottom: 50%; }
  @media only print, only screen and (min-width: 48.063em) {
    .main-banner:before {
      padding-bottom: 30%; } }
  @media only print, only screen and (min-width: 100.063em) {
    .main-banner:before {
      padding-bottom: 480px; } }

.main-body {
  position: relative;
  z-index: 0; }
  .main-body .main-content {
    padding-top: 0; }
  .main-body .titlePage h1 {
    text-align: center; }
  .main-body .richContent {
    margin: auto; }
    @media only print, only screen and (min-width: 75.063em) {
      .main-body .richContent {
        max-width: 75%; } }

.home-menu {
  background-color: #4B4B4B; }
  .home-menu > .row {
    padding-bottom: 4em; }
  .home-menu h2, .home-menu h3 {
    font-family: 'Trirong', serif; }
  .home-menu h2 {
    text-align: center;
    font-size: 1.563rem;
    color: #FFF;
    padding: 2rem;
    padding-top: 3rem; }

.home-menu-list {
  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;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; }

.home-menu-item {
  position: relative;
  padding: 3em;
  -webkit-transition: -webkit-transform 0.25s;
  transition: -webkit-transform 0.25s;
  -o-transition: transform 0.25s;
  transition: transform 0.25s;
  transition: transform 0.25s, -webkit-transform 0.25s;
  width: 100%; }
  .home-menu-item:after,
  .home-menu-item > .bt {
    content: '';
    display: block;
    position: absolute;
    top: 1em;
    right: 1em;
    bottom: 1em;
    left: 1em; }
  .home-menu-item:after {
    z-index: -1;
    -webkit-transition: background-color 0.25s linear, -webkit-box-shadow 0.25s ease-in-out;
    transition: background-color 0.25s linear, -webkit-box-shadow 0.25s ease-in-out;
    -o-transition: background-color 0.25s linear, box-shadow 0.25s ease-in-out;
    transition: background-color 0.25s linear, box-shadow 0.25s ease-in-out;
    transition: background-color 0.25s linear, box-shadow 0.25s ease-in-out, -webkit-box-shadow 0.25s ease-in-out; }
  .home-menu-item > .bt {
    text-indent: -9999px; }
  .home-menu-item .home-menu-item-illustration {
    width: 10rem;
    height: 10rem;
    border-radius: 50%;
    background-color: #ccc;
    border: 2px solid #fff;
    margin: auto;
    background-position: center center;
    background-size: cover;
    margin-bottom: 1em;
    background-image: url(../../../favicon.svg);
    background-repeat: no-repeat; }
    .home-menu-item .home-menu-item-illustration:not([style]) {
      background-size: contain; }
  .home-menu-item .home-menu-item-title {
    display: block;
    font-size: 1.563em;
    font-weight: bold;
    margin-bottom: 0.5em;
    text-align: center;
    color: #E75012;
    line-height: 1.25; }
  .home-menu-item .home-menu-item-overview {
    color: #FFFFFF;
    text-align: center;
    -webkit-transition: color 0.25s;
    -o-transition: color 0.25s;
    transition: color 0.25s; }
  .home-menu-item:hover {
    -webkit-transform: translateY(-0.5em);
        -ms-transform: translateY(-0.5em);
            transform: translateY(-0.5em); }
    .home-menu-item:hover:after {
      background-color: rgba(255, 255, 255, 0.15); }
  @media only print, only screen and (min-width: 30.063em) {
    .home-menu-item {
      max-width: 560px;
      min-height: 220px; }
      .home-menu-item .home-menu-item-illustration {
        position: absolute;
        top: 2em; }
      .home-menu-item:nth-child(even) {
        padding-left: calc( 5em + 140px); }
        .home-menu-item:nth-child(even) .home-menu-item-illustration {
          left: 1.5rem; }
        .home-menu-item:nth-child(even) .home-menu-item-title, .home-menu-item:nth-child(even) .home-menu-item-overview {
          text-align: left; }
      .home-menu-item:nth-child(odd) {
        padding-right: calc( 5em + 140px); }
        .home-menu-item:nth-child(odd) .home-menu-item-illustration {
          right: 1.5rem; }
        .home-menu-item:nth-child(odd) .home-menu-item-title, .home-menu-item:nth-child(odd) .home-menu-item-overview {
          text-align: right; } }
  @media only print, only screen and (min-width: 60.063em) {
    .home-menu-item {
      font-size: 1.3vw;
      width: 26%; }
      .home-menu-item .home-menu-item-illustration {
        position: relative;
        top: auto; }
      .home-menu-item:nth-child(n) {
        padding-left: 3em;
        padding-right: 3em; }
        .home-menu-item:nth-child(n) .home-menu-item-illustration {
          right: auto;
          left: auto; }
        .home-menu-item:nth-child(n) .home-menu-item-title, .home-menu-item:nth-child(n) .home-menu-item-overview {
          text-align: center; } }
  @media only print, only screen and (min-width: 75.063em) {
    .home-menu-item {
      font-size: 1em; } }

.home-news {
  padding: 2rem 0; }
  .home-news h2 {
    font-family: 'Trirong', serif; }
  .home-news > h2 {
    text-align: center;
    font-size: 1.563rem;
    font-weight: 600;
    color: #172983;
    padding: 2rem;
    padding-top: 3rem; }

.listArticle {
  position: relative; }
  .no-touch .listArticle {
    padding: 0 3.5em; }
  .listArticle .control {
    display: none; }
    .no-touch .listArticle .control {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      position: absolute;
      top: 8px;
      bottom: 8px;
      cursor: pointer;
      width: 3em;
      background: rgba(255, 255, 255, 0.25);
      z-index: 1; }
      .no-touch .listArticle .control:hover {
        background: rgba(255, 255, 255, 0.75); }
      .no-touch .listArticle .control.prev {
        left: 0; }
        .no-touch .listArticle .control.prev:before {
          content: '\002039';
          font-size: 4em; }
      .no-touch .listArticle .control.next {
        right: 0; }
        .no-touch .listArticle .control.next:before {
          content: '\00203a';
          font-size: 4em; }
      .no-touch .listArticle .control.disabled {
        color: #CCCCCC;
        cursor: auto; }

.carousel-controller {
  display: none;
  pointer-events: none; }
  .no-touch .carousel-controller {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between; }
    .no-touch .carousel-controller .control {
      width: 60px;
      height: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      color: white;
      background: transparent;
      z-index: 10;
      pointer-events: all;
      cursor: pointer;
      width: 4em; }
      .no-touch .carousel-controller .control:before {
        text-shadow: 0 0 4px #000; }
      .no-touch .carousel-controller .control:hover {
        background: rgba(0, 0, 0, 0.25); }
      .no-touch .carousel-controller .control.prev::before {
        content: '\002039';
        font-size: 4em;
        left: 0; }
      .no-touch .carousel-controller .control.next::before {
        content: '\00203a';
        font-size: 4em;
        right: 0; }

.listArticle-list {
  padding: 0 !important;
  scrollbar-width: thin;
  scrollbar-color: #172983 #ffffff;
  /* Foreground, Background */ }
  .listArticle-list::-webkit-scrollbar {
    height: 11px;
    /* Mostly for horizontal scrollbars */ }
  .listArticle-list::-webkit-scrollbar-track {
    /* Background */
    background: #ffffff;
    -webkit-box-shadow: inset 0 0 10px #CCCCCC;
            box-shadow: inset 0 0 10px #CCCCCC;
    border-radius: 10px; }
  .listArticle-list::-webkit-scrollbar-thumb {
    /* Foreground */
    background-color: #172983;
    border-radius: 6px;
    border: 3px solid #ffffff; }
    .listArticle-list::-webkit-scrollbar-thumb:hover {
      border-color: #172983; }