:root {
  --color-red: #f00;
  --theme-color: #00047f;
  --theme2-color: #edae02;
  --header-top-bg: #47ba35;
  --header-bg: #fff;
  --menu-bg: #e81015;
  --valak-bg: #00047f;
  --menu-link-hover-color: #edae02;
  --menu-item-hover-bg: #000;
  --footer-bg: #e41721;
  --copyright-bg: #9a020a;
  --title-font: Bungee;
  --text-font: "Mulish", sans-serif;
  --menu-font: "Mulish", sans-serif; }

/* ======================== FONTS ======================== */
/* ==================== BORDER RADIUS ==================== */
/* Ref: 
    http://www.w3schools.com/css/css3_borders.asp 
    http://border-radius.com/
    border-radius: tl tr br bl:
*/
/* ==================== BOX SHADOW ==================== */
/* Ref: 
    http://www.cssmatic.com/box-shadow
*/
/* ==================== Set Font ==================== */
/* ==================== HOVER A ==================== */
/* Ref: 
*/
/*
@include transition(all .3s ease);
@mixin transition($args...) {
  -webkit-transition: $args;
  -moz-transition: $args;
  -ms-transition: $args;
  -o-transition: $args;
  transition: $args;
}
*/
/*
@include background-opacity(#000, $opacity: 0.3);
*/
.fixed-shadow:after {
  content: '';
  position: absolute; }

.marquee {
  -webkit-animation: marquee 10s linear infinite;
  -moz-animation: marquee 10s linear infinite;
  -ms-animation: marquee 10s linear infinite;
  -o-animation: marquee 10s linear infinite;
  animation: marquee 10s linear infinite; }

.text-theme {
  color: #00047f !important; }

.overlay {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  opacity: 0;
  background-color: rgba(0, 0, 0, 0.3); }
  @media screen and (prefers-reduced-motion: reduce) {
    .overlay {
      transition: none; } }
  .overlay__box {
    position: absolute;
    top: 20px;
    left: 30px;
    width: calc(100% - 60px);
    height: calc(100% - 40px);
    border: 3px solid #fff; }

.fixed-shadow:after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-transition: opacity 0.3s;
  -moz-transition: opacity 0.3s;
  -ms-transition: opacity 0.3s;
  -o-transition: opacity 0.3s;
  transition: opacity 0.3s;
  z-index: -1;
  box-shadow: 0 0.0625em 0.5em rgba(0, 0, 0, 0.3);
  opacity: 0; }
  @media screen and (prefers-reduced-motion: reduce) {
    .fixed-shadow:after {
      transition: none; } }

.fixed-shadow.fixed::after {
  opacity: 1; }

/* Menu RP */
.menu-res {
  display: none;
  height: 55px;
  z-index: 10;
  background: var(--color-red);
  position: relative;
  line-height: normal; }

.menu-bar-res {
  height: 55px;
  padding: 0px 10px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  justify-content: space-between; }

#menu {
  display: none; }

#hamburger {
  display: block;
  width: 45px;
  height: 23px;
  position: relative; }

#hamburger:before, #hamburger:after, #hamburger span {
  background: #fff;
  content: '';
  display: block;
  width: 100%;
  height: 3px;
  position: absolute;
  left: 0px; }

#hamburger:before {
  top: 0px; }

#hamburger span {
  top: 10px; }

#hamburger:after {
  top: 20px; }

#hamburger:before, #hamburger:after, #hamburger span {
  -webkit-transition: none 0.5s ease 0.5s;
  transition: none 0.5s ease 0.5s;
  -webkit-transition-property: transform,top,bottom,left,opacity;
  transition-property: transform,top,bottom,left,opacity; }

.mm-wrapper_opening #hamburger:before, .mm-wrapper_opening #hamburger:after {
  top: 10px; }

.mm-wrapper_opening #hamburger span {
  left: -50px;
  opacity: 0; }

.mm-wrapper_opening #hamburger:before {
  transform: rotate(45deg); }

.mm-wrapper_opening #hamburger:after {
  transform: rotate(-45deg); }

.mm-menu_opened {
  display: block !important; }

/* Search RP */
.search-res {
  position: relative;
  float: right; }

.search-res .icon-search {
  width: 40px;
  height: 40px;
  cursor: pointer;
  text-align: center;
  line-height: 42px;
  color: #fff;
  font-size: 17px;
  margin: 0px; }

.search-res .icon-search.active {
  color: var(--color-red);
  background: #fff;
  border-radius: 100%; }

.search-res .search-grid {
  position: absolute;
  top: 50px;
  right: 0px;
  width: 0px;
  height: 40px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--color-red);
  z-index: 2;
  opacity: 0;
  border-radius: 25px;
  line-height: normal; }

.search-res .search-grid p {
  float: left;
  width: 35px;
  height: 38px;
  cursor: pointer;
  outline: none;
  border: none;
  margin: 0px;
  font-size: 17px;
  display: block;
  color: var(--color-red);
  line-height: 40px;
  text-align: center; }

.search-res .search-grid input {
  width: calc(100% - 35px);
  float: right;
  line-height: 38px;
  outline: none;
  border: none;
  color: var(--color-red); }

.search-res .search-grid input::-webkit-input-placeholder {
  color: #ccc; }

.search-res .search-grid input:-moz-placeholder {
  color: #ccc; }

.search-res .search-grid input::-moz-placeholder {
  color: #ccc; }

.search-res .search-grid input:-ms-input-placeholder {
  color: #ccc; }

.wap_item {
  box-sizing: border-box;
  display: flex;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-left: -0.8333333333%;
  margin-right: -0.8333333333%; }
  .wap_item.slick-slider {
    margin: 0 -0.625em; }

.product {
  box-sizing: border-box;
  flex: 0 0 23.3333333333%;
  margin-left: 0.8333333333%;
  margin-right: 0.8333333333%;
  margin-bottom: 1.6666666667%; }
  .slick-slider .product {
    padding: 0 0.625em;
    width: 100%;
    margin: 0; }

.wap_dv {
  box-sizing: border-box;
  display: flex;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-left: -0.8333333333%;
  margin-right: -0.8333333333%; }

.dichvu__item {
  box-sizing: border-box;
  flex: 0 0 31.6666666667%;
  margin-left: 0.8333333333%;
  margin-right: 0.8333333333%;
  margin-bottom: 1.6666666667%; }

@media (max-width: 1001px) {
  .menu-res {
    display: block; } }

/*  ================================================================================
  MIXIN DEVICES
  ================================================================================ */
/*========= SLIDER ===============*/
/*========= HEADER ===============*/
/*========= FOOTER ===============*/
/*========= MENU ===============*/
/*========= PRODUCT ===============*/
/*========= NEW ===============*/
/*  ================================================================================
  LARGE DEVICES 
  Large Desktops 1200px and Up (>1200) 
  ================================================================================ */
/*  ================================================================================
  MEDIUM DEVICES
  Desktops 992px and Up (>992px & <1200px)
  ================================================================================ */
/*  ================================================================================
  SMALL DEVICES
  Tablets 768px and Up (>768px & <992px)
  ================================================================================ */
@media screen and (min-width: 768px) and (max-width: 992px) {
  #toptop {
    display: none !important; }
  .wap_1200 {
    padding: 0 1em; }
  #wapper {
    min-width: auto; }
  .logo {
    width: 15%;
    padding: 1em;
    background: #fff;
    margin: .5em 1em;
    border-radius: 100%; }
    .logo .sp_img {
      position: relative;
      display: block;
      max-width: 100%; }
      .logo .sp_img:before {
        display: block;
        content: "";
        width: 100%;
        padding-top: 100%; }
      .logo .sp_img img {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: scale-down;
        object-position: center center; }
  .banner {
    width: 85%; }
  .bghl {
    display: none; }
  .wap_menu {
    display: none; }
  .menu-bar-res--right {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -moz-flex: 1;
    -ms-flex: 1;
    flex: 1;
    box-sizing: border-box;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center; }
    .menu-bar-res--right .lang-header {
      margin: 0 1rem 0; }
  .menu-res {
    background-color: #00036b; }
  #main_footer, .fanpage {
    width: 100%; }
  #main_footer {
    margin-bottom: 1em; }
  .wap_footer .flex {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .dichvu__item {
    box-sizing: border-box;
    flex: 0 0 48.3333333333%;
    margin-left: 0.8333333333%;
    margin-right: 0.8333333333%;
    margin-bottom: 1.6666666667%; }
    .dichvu__item .dv_name {
      width: 100%; }
      .dichvu__item .dv_name i {
        display: none; }
      .dichvu__item .dv_name a {
        font-size: 16px; }
      .dichvu__item .dv_name span {
        width: 100%; }
  .zoom_slick, .tt_lh {
    float: none;
    display: block;
    width: 100%;
    margin-bottom: 1em; }
  .product_info, .rightlh {
    float: none;
    display: block;
    width: 100%; }
  .hinhgt {
    display: none; }
  .noidunggt {
    width: 100%;
    margin: 1em 0; }
  .tinnb, .video {
    float: none;
    display: block;
    width: 100%; }
  .tinnb {
    margin-bottom: 1em; }
  .video2 {
    width: calc(100% - 120px); }
  .wap_dknt:before {
    display: none; }
  .mxh {
    width: 100%;
    text-align: center;
    margin: 1em 0; }
  .wap_dknt {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
    .wap_dknt .tdt {
      width: 100%;
      text-align: center;
      margin: 10px 0; }
    .wap_dknt .dknt {
      width: 100%;
      display: block;
      margin: 0 auto; }
  .product-grid {
    box-sizing: border-box;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -0.8333333333%;
    margin-right: -0.8333333333%; }
  .product {
    box-sizing: border-box;
    flex: 0 0 48.3333333333%;
    margin-left: 0.8333333333%;
    margin-right: 0.8333333333%;
    margin-bottom: 1.6666666667%; } }

/*  ================================================================================
  EXTRA SMALL
  (>425px & <768px)
  ================================================================================ */
@media screen and (min-width: 425px) and (max-width: 768px) {
  #toptop {
    display: none !important; }
  .wap_1200 {
    padding: 0 1em; }
  #wapper {
    min-width: auto; }
  .logo {
    width: 15%;
    padding: 1em;
    background: #fff;
    margin: .5em 1em;
    border-radius: 100%; }
    .logo .sp_img {
      position: relative;
      display: block;
      max-width: 100%; }
      .logo .sp_img:before {
        display: block;
        content: "";
        width: 100%;
        padding-top: 100%; }
      .logo .sp_img img {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: scale-down;
        object-position: center center; }
  .banner {
    width: 85%; }
  .bghl {
    display: none; }
  .wap_menu {
    display: none; }
  .menu-bar-res--right {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -moz-flex: 1;
    -ms-flex: 1;
    flex: 1;
    box-sizing: border-box;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center; }
    .menu-bar-res--right .lang-header {
      margin: 0 1rem 0; }
  .menu-res {
    background-color: #00036b; }
  #main_footer, .fanpage {
    width: 100%; }
  #main_footer {
    margin-bottom: 1em; }
  .wap_footer .flex {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .dichvu__item {
    box-sizing: border-box;
    flex: 0 0 48.3333333333%;
    margin-left: 0.8333333333%;
    margin-right: 0.8333333333%;
    margin-bottom: 1.6666666667%; }
    .dichvu__item .dv_name {
      width: 100%; }
      .dichvu__item .dv_name i {
        display: none; }
      .dichvu__item .dv_name a {
        font-size: 16px; }
      .dichvu__item .dv_name span {
        width: 100%; }
  .zoom_slick, .tt_lh {
    float: none;
    display: block;
    width: 100%;
    margin-bottom: 1em; }
  .product_info, .rightlh {
    float: none;
    display: block;
    width: 100%; }
  .hinhgt {
    display: none; }
  .noidunggt {
    width: 100%;
    margin: 1em 0; }
  .tinnb, .video {
    float: none;
    display: block;
    width: 100%; }
  .tinnb {
    margin-bottom: 1em; }
  .video2 {
    width: calc(100% - 120px); }
  .wap_dknt:before {
    display: none; }
  .mxh {
    width: 100%;
    text-align: center;
    margin: 1em 0; }
  .wap_dknt {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
    .wap_dknt .tdt {
      width: 100%;
      text-align: center;
      margin: 10px 0; }
    .wap_dknt .dknt {
      width: 100%;
      display: block;
      margin: 0 auto; }
  .product-grid {
    box-sizing: border-box;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -0.8333333333%;
    margin-right: -0.8333333333%; }
  .product {
    box-sizing: border-box;
    flex: 0 0 48.3333333333%;
    margin-left: 0.8333333333%;
    margin-right: 0.8333333333%;
    margin-bottom: 1.6666666667%; } }

/*  ================================================================================
  MOBILE SIZE
  Phones Less than 425px
  (<425px)
  ================================================================================ */
@media screen and (max-width: 425px) {
  #toptop {
    display: none !important; }
  .wap_1200 {
    padding: 0 1em; }
  #wapper {
    min-width: auto; }
  .logo {
    width: 15%;
    padding: 1em;
    background: #fff;
    margin: .5em 1em;
    border-radius: 100%; }
    .logo .sp_img {
      position: relative;
      display: block;
      max-width: 100%; }
      .logo .sp_img:before {
        display: block;
        content: "";
        width: 100%;
        padding-top: 100%; }
      .logo .sp_img img {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: scale-down;
        object-position: center center; }
  .banner {
    width: 85%; }
  .bghl {
    display: none; }
  .wap_menu {
    display: none; }
  .menu-bar-res--right {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -moz-flex: 1;
    -ms-flex: 1;
    flex: 1;
    box-sizing: border-box;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center; }
    .menu-bar-res--right .lang-header {
      margin: 0 1rem 0; }
  .menu-res {
    background-color: #00036b; }
  #main_footer, .fanpage {
    width: 100%; }
  #main_footer {
    margin-bottom: 1em; }
  .wap_footer .flex {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .dichvu__item {
    box-sizing: border-box;
    flex: 0 0 48.3333333333%;
    margin-left: 0.8333333333%;
    margin-right: 0.8333333333%;
    margin-bottom: 1.6666666667%; }
    .dichvu__item .dv_name {
      width: 100%; }
      .dichvu__item .dv_name i {
        display: none; }
      .dichvu__item .dv_name a {
        font-size: 16px; }
      .dichvu__item .dv_name span {
        width: 100%; }
  .zoom_slick, .tt_lh {
    float: none;
    display: block;
    width: 100%;
    margin-bottom: 1em; }
  .product_info, .rightlh {
    float: none;
    display: block;
    width: 100%; }
  .hinhgt {
    display: none; }
  .noidunggt {
    width: 100%;
    margin: 1em 0; }
  .tinnb, .video {
    float: none;
    display: block;
    width: 100%; }
  .tinnb {
    margin-bottom: 1em; }
  .video2 {
    width: calc(100% - 120px); }
  .wap_dknt:before {
    display: none; }
  .mxh {
    width: 100%;
    text-align: center;
    margin: 1em 0; }
  .wap_dknt {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
    .wap_dknt .tdt {
      width: 100%;
      text-align: center;
      margin: 10px 0; }
    .wap_dknt .dknt {
      width: 100%;
      display: block;
      margin: 0 auto; }
  .product-grid {
    box-sizing: border-box;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -0.8333333333%;
    margin-right: -0.8333333333%; }
  .product {
    box-sizing: border-box;
    flex: 0 0 48.3333333333%;
    margin-left: 0.8333333333%;
    margin-right: 0.8333333333%;
    margin-bottom: 1.6666666667%; } }

@media screen and (max-width: 425px) and (max-width: 330px) {
  .product-grid {
    box-sizing: border-box;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: 0;
    margin-right: 0; }
  .product {
    box-sizing: border-box;
    flex: 0 0 100%; } }

@media screen and (max-width: 425px) {
  .header .flex {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .logo {
    width: 25%; }
  .banner {
    width: 100%;
    margin-bottom: 10px; }
  .pten {
    font-size: 20px; }
  .psl {
    font-size: 16px; } }