@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-Black.eot');
  src: url('/fonts/FCIconic-Black.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-Black.woff2') format('woff2'),
      url('/fonts/FCIconic-Black.woff') format('woff'),
      url('/fonts/FCIconic-Black.ttf') format('truetype'),
      url('/fonts/FCIconic-Black.svg#FCIconic-Black') format('svg');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-Bold.eot');
  src: url('/fonts/FCIconic-Bold.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-Bold.woff2') format('woff2'),
      url('/fonts/FCIconic-Bold.woff') format('woff'),
      url('/fonts/FCIconic-Bold.ttf') format('truetype'),
      url('/fonts/FCIconic-Bold.svg#FCIconic-Bold') format('svg');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-BlackItalic.eot');
  src: url('/fonts/FCIconic-BlackItalic.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-BlackItalic.woff2') format('woff2'),
      url('/fonts/FCIconic-BlackItalic.woff') format('woff'),
      url('/fonts/FCIconic-BlackItalic.ttf') format('truetype'),
      url('/fonts/FCIconic-BlackItalic.svg#FCIconic-BlackItalic') format('svg');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-BoldItalic.eot');
  src: url('/fonts/FCIconic-BoldItalic.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-BoldItalic.woff2') format('woff2'),
      url('/fonts/FCIconic-BoldItalic.woff') format('woff'),
      url('/fonts/FCIconic-BoldItalic.ttf') format('truetype'),
      url('/fonts/FCIconic-BoldItalic.svg#FCIconic-BoldItalic') format('svg');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-ExtraBold.eot');
  src: url('/fonts/FCIconic-ExtraBold.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-ExtraBold.woff2') format('woff2'),
      url('/fonts/FCIconic-ExtraBold.woff') format('woff'),
      url('/fonts/FCIconic-ExtraBold.ttf') format('truetype'),
      url('/fonts/FCIconic-ExtraBold.svg#FCIconic-ExtraBold') format('svg');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-ExtraBoldItalic.eot');
  src: url('/fonts/FCIconic-ExtraBoldItalic.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-ExtraBoldItalic.woff2') format('woff2'),
      url('/fonts/FCIconic-ExtraBoldItalic.woff') format('woff'),
      url('/fonts/FCIconic-ExtraBoldItalic.ttf') format('truetype'),
      url('/fonts/FCIconic-ExtraBoldItalic.svg#FCIconic-ExtraBoldItalic') format('svg');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-ExtraLightItalic.eot');
  src: url('/fonts/FCIconic-ExtraLightItalic.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-ExtraLightItalic.woff2') format('woff2'),
      url('/fonts/FCIconic-ExtraLightItalic.woff') format('woff'),
      url('/fonts/FCIconic-ExtraLightItalic.ttf') format('truetype'),
      url('/fonts/FCIconic-ExtraLightItalic.svg#FCIconic-ExtraLightItalic') format('svg');
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-ExtraLight.eot');
  src: url('/fonts/FCIconic-ExtraLight.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-ExtraLight.woff2') format('woff2'),
      url('/fonts/FCIconic-ExtraLight.woff') format('woff'),
      url('/fonts/FCIconic-ExtraLight.ttf') format('truetype'),
      url('/fonts/FCIconic-ExtraLight.svg#FCIconic-ExtraLight') format('svg');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-Italic.eot');
  src: url('/fonts/FCIconic-Italic.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-Italic.woff2') format('woff2'),
      url('/fonts/FCIconic-Italic.woff') format('woff'),
      url('/fonts/FCIconic-Italic.ttf') format('truetype'),
      url('/fonts/FCIconic-Italic.svg#FCIconic-Italic') format('svg');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-MediumItalic.eot');
  src: url('/fonts/FCIconic-MediumItalic.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-MediumItalic.woff2') format('woff2'),
      url('/fonts/FCIconic-MediumItalic.woff') format('woff'),
      url('/fonts/FCIconic-MediumItalic.ttf') format('truetype'),
      url('/fonts/FCIconic-MediumItalic.svg#FCIconic-MediumItalic') format('svg');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-Medium.eot');
  src: url('/fonts/FCIconic-Medium.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-Medium.woff2') format('woff2'),
      url('/fonts/FCIconic-Medium.woff') format('woff'),
      url('/fonts/FCIconic-Medium.ttf') format('truetype'),
      url('/fonts/FCIconic-Medium.svg#FCIconic-Medium') format('svg');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-LightItalic.eot');
  src: url('/fonts/FCIconic-LightItalic.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-LightItalic.woff2') format('woff2'),
      url('/fonts/FCIconic-LightItalic.woff') format('woff'),
      url('/fonts/FCIconic-LightItalic.ttf') format('truetype'),
      url('/fonts/FCIconic-LightItalic.svg#FCIconic-LightItalic') format('svg');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-Light.eot');
  src: url('/fonts/FCIconic-Light.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-Light.woff2') format('woff2'),
      url('/fonts/FCIconic-Light.woff') format('woff'),
      url('/fonts/FCIconic-Light.ttf') format('truetype'),
      url('/fonts/FCIconic-Light.svg#FCIconic-Light') format('svg');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-SemiBold.eot');
  src: url('/fonts/FCIconic-SemiBold.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-SemiBold.woff2') format('woff2'),
      url('/fonts/FCIconic-SemiBold.woff') format('woff'),
      url('/fonts/FCIconic-SemiBold.ttf') format('truetype'),
      url('/fonts/FCIconic-SemiBold.svg#FCIconic-SemiBold') format('svg');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-ThinItalic.eot');
  src: url('/fonts/FCIconic-ThinItalic.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-ThinItalic.woff2') format('woff2'),
      url('/fonts/FCIconic-ThinItalic.woff') format('woff'),
      url('/fonts/FCIconic-ThinItalic.ttf') format('truetype'),
      url('/fonts/FCIconic-ThinItalic.svg#FCIconic-ThinItalic') format('svg');
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-Thin.eot');
  src: url('/fonts/FCIconic-Thin.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-Thin.woff2') format('woff2'),
      url('/fonts/FCIconic-Thin.woff') format('woff'),
      url('/fonts/FCIconic-Thin.ttf') format('truetype'),
      url('/fonts/FCIconic-Thin.svg#FCIconic-Thin') format('svg');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-Regular.eot');
  src: url('/fonts/FCIconic-Regular.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-Regular.woff2') format('woff2'),
      url('/fonts/FCIconic-Regular.woff') format('woff'),
      url('/fonts/FCIconic-Regular.ttf') format('truetype'),
      url('/fonts/FCIconic-Regular.svg#FCIconic-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'FC Iconic';
  src: url('/fonts/FCIconic-SemiBoldItalic.eot');
  src: url('/fonts/FCIconic-SemiBoldItalic.eot?#iefix') format('embedded-opentype'),
      url('/fonts/FCIconic-SemiBoldItalic.woff2') format('woff2'),
      url('/fonts/FCIconic-SemiBoldItalic.woff') format('woff'),
      url('/fonts/FCIconic-SemiBoldItalic.ttf') format('truetype'),
      url('/fonts/FCIconic-SemiBoldItalic.svg#FCIconic-SemiBoldItalic') format('svg');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}


/*==================================================
    General
==================================================*/

html,body{
  padding: 0;
  margin: 0; 
  height: 100%; 
 
}  
body{     
  
  margin:0; 
  padding:0;  
 
  position: relative;
  overflow-x: hidden;

  overscroll-behavior: contain;
}

.modal-open{
  touch-action: none; 
  overscroll-behavior: contain;
}
 

.modal-backdrop{
  overscroll-behavior: contain;
}

.pc body{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; 
  image-rendering: -webkit-optimize-contrast;
}
 
a{
  color:inherit;
  text-decoration: none; 
  transition: all 0.2s ease-in-out;
}
a:hover{ text-decoration: none;   }
 
.star{ color: #bc0000 }

.form-control,
.form-select{
 -webkit-appearance: none;
   
  padding:0 15px;

  color:var(--black);
  font-size: var(--body-M);
  font-weight:300; 
  font-family:inherit;  

  height:52px;
  line-height:50px;  
  background:#fff; 
  border-radius: 0;   
 
    -webkit-transition: all 0.2s ease-in-out;
       -moz-transition: all 0.2s ease-in-out;
         -o-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
}
  
.form-control:disabled, 
.form-control[readonly] {
background: #e2e2e2;
border-color: #c7c7c7;
} 
 
.form-select{
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23595959' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
  background-position: right 0.75rem center;
  background-size: 18px 15px;
  background-repeat: no-repeat;
}

textarea.form-control{
  height: 150px;
  line-height: normal;
  padding-top: 10px; 
}
 
.form-group{
  display: block;
  position: relative;
  margin-bottom: 20px;
}
.form-group label.title{
  text-align: left;
  display: block; 

  font-weight: 600; 
  margin-bottom:2px;
  padding: 0 0 10px 0;
  /* text-transform: uppercase; */
} 
  
.form-group label.title .star{
  color:#ED1C24;
  margin-right: 3px;
}

.form-group span.error{
  color:#ED1C24;
  font-size: 14px;
  padding-top: 3px;
}
 
.form-group .group{
  position: relative;
  display: block;
} 
.form-group .group .icons{
  position: absolute;
  top: 0 !important;
  right: 15px;
  bottom: 0 !important;
} 
.form-group .group .icons.left{
  left: 10px;
  right: auto;
}
.form-group .group .icons.left + .form-control{
  padding-left: 35px;
}
.form-check {
  position: relative;
  padding-left:1.5em;
}
.form-check .form-check-input{
  width: 16px;
  height: 16px;
  margin-right: 10px; 
  border-width: 1px;
  position: absolute;
  top: 5px;
  margin-left: -1.5em;
  border-radius: 0;
  border: 1px solid var(--gray-15);
}
.form-check .form-check-input[type=radio]{
  border-radius: 50%;
}
.form-check .form-check-input:checked[type=radio]{
  box-shadow: none !important;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%232E3192'/%3e%3c/svg%3e");
}

.form-check label{
  margin-bottom:0;
  font-weight: 400;
  font-size: inherit;
  padding-top: 3px; 
}
.form-check-input:checked[type=checkbox], 
.form-check-input.rounded:checked[type=radio]{
  background-color:transparent;
  border: 1px solid rgba(81, 68, 41, 0.6);
  background-image: url(/img/icons/icon-checked.svg);
  background-size: 80%;
  background-position:2px 3px;
}
.dropdown.select{cursor: pointer;}
.dropdown.select a[data-bs-toggle]{
  border-bottom: 1px solid var(--gray-15);
  font-size: var(--body-M);
  line-height: var(--body-M-line-height);
  color: var(--gray-50);
}
.dropdown.select a[data-bs-toggle].selected{
  color: var(--black);
}
 
.dropdown.select a[data-bs-toggle]:before{
  content: '';
  position: absolute;
  top:40%;
  right: 0;
  width: 14px;
  height: 14px;
  
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url(/img/icons/icon-arrow-select.svg);
} 
.dropdown.select a[data-bs-toggle].show{border-color: transparent !important;}

.dropdown.select.venue [data-bs-toggle] + .icon-arrow{
  top: 15%;
  position: absolute;
  right: 0;
  width: 14px;
  height: 14px;
  opacity: 1;
   
  background-image: url(/img/icons/icon-arrow-select.svg);
  cursor: pointer; 
}
.dropdown.select.venue.has-value [data-bs-toggle] + .icon-arrow{
  opacity: 0;
}

.dropdown.select .dropdown-menu{
  display: block;
  opacity: 0;
  pointer-events: none;
  width: 100%;
  top: 100% !important;
  margin:0 !important;
  max-height: 210px;
  overflow: hidden;
  overflow-y: auto;
}
.dropdown.select .dropdown-menu.show{
  opacity: 1;
  pointer-events: all;
}
.dropdown.select .dropdown-menu > li >a,
.dropdown.select .dropdown-menu > li >span{
  display: block;
  font-size: var(--body-M);
  line-height: var(--body-M-line-height);
  font-weight: 300;
  padding: 10px 20px;
  cursor: pointer;
}
.dropdown.select .dropdown-menu > li:hover >a,
.dropdown.select .dropdown-menu > li:hover >span{
  background-color: var(--light-blue-5);
}

.dropdown.select .dropdown-menu > li.li-selected >a,
.dropdown.select .dropdown-menu > li.li-selected >span{
  background-color: var(--light-blue-5);
}
.dropdown.select .dropdown-menu > li.title{
  color: var(--highlight-color-1);
  font-size: var(--body-XS);
  line-height: var(--body-XS-line-height);
  padding:5px 20px ;
  pointer-events: none;
}

.form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color:var(--gray-50);
  opacity: 1; /* Firefox */
}

.form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color:var(--gray-50);
}

.form-control::-ms-input-placeholder { /* Microsoft Edge */
  color:var(--gray-50);
}


.btn{
  position: relative; 
  padding:0 25px;    
  font-weight: 500;   
  height: 60px;
  line-height:58px;
  border-radius:5px;   
  transition: all 0.25s ease-in-out;   
  font-size: var(--body-M);

  --bs-btn-color:#fff;
  --bs-btn-border-color: var(--primary-color);
  --bs-btn-bg:var(--primary-color);
 
  --bs-btn-hover-color:var(--bs-btn-color);
  --bs-btn-hover-bg:var(--highlight-color-1);
  --bs-btn-hover-border-color:var(--highlight-color-1);

  --bs-btn-active-color:var(--bs-btn-hover-color);
  --bs-btn-active-bg:var(--bs-btn-hover-bg);
  --bs-btn-active-border-color:var(--bs-btn-hover-border-color);
}

.device .btn{
  /* --bs-btn-active-color:var(--bs-btn-color);
  --bs-btn-active-bg:var(--bs-btn-bg);
  --bs-btn-active-border-color:var(--bs-btn-border-color); */

  --bs-btn-hover-color:var(--bs-btn-color);
  --bs-btn-hover-bg:var(--bs-btn-bg);
  --bs-btn-hover-border-color:var(--bs-btn-border-color); 
}
 
.btn-outline-white{ 
  --bs-btn-color:#fff;
  --bs-btn-border-color: #fff;
  --bs-btn-bg:transparent; 
}

.btn-outline-black{ 
  --bs-btn-color:var(--black);
  --bs-btn-border-color:var(--black);
  --bs-btn-bg:transparent;

  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg:var(--primary-color);
  --bs-btn-hover-border-color:var(--primary-color);
}

.btn-white{ 
  --bs-btn-color:var(--black);
  --bs-btn-border-color:#ffffff;
  --bs-btn-bg:#ffffff;

  --bs-btn-hover-color:#fff;   
}
 
.btn-orange{ 
  --bs-btn-color:#fff;
  --bs-btn-border-color:var(--highlight-color-1);
  --bs-btn-bg:var(--highlight-color-1);

  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg:var(--primary-color);
  --bs-btn-hover-border-color:var(--primary-color);
}

 
.btn[disabled]{
  border-color: #D4EAEA;
  background-color:#D4EAEA;
  color:#A1C9C9;
  line-height: 56px;
  pointer-events: none;
  opacity: 1;
} 
.btn.disabled, .btn:disabled{opacity: 0.35; pointer-events: none;}
.btn svg,
.btn img{
  position: relative;
  left: 0;
  -webkit-transition: all 0.2s ease-in-out;
     -moz-transition: all 0.2s ease-in-out;
       -o-transition: all 0.2s ease-in-out;
      -ms-transition: all 0.2s ease-in-out;
          transition: all 0.2s ease-in-out;
}
.btn.rounded {border-radius: 50px !important;}

.btn.w-400{
  width: 100%;
  max-width: 400px;
}
.btn.w-120{
  width: 100%;
  max-width: 120px;
}

.btn-md{
  height: 44px;
  line-height: 42px;
}
 
.btn-link, 
.btn-link:hover, 
.btn-link:focus, 
.btn-link:active{
  background-color: transparent;
} 

.btn:focus,.btn:active,
button:focus,button:active,
a:focus,a:active {
   outline: none !important;
   box-shadow: none!important;
} 
.buttons{
  display: block; 
  text-align: center;
  padding-top: 30px;
  padding-bottom: 30px;
} 
  
.buttons.d-flex {
  -ms-flex-pack: center;
justify-content: center;
}
 
svg path,
svg rect,
svg line,
svg circle,
svg polygon{ 
  -webkit-transition: all 0.2s ease-in-out;
     -moz-transition: all 0.2s ease-in-out;
       -o-transition: all 0.2s ease-in-out;
      -ms-transition: all 0.2s ease-in-out;
          transition: all 0.2s ease-in-out;
} 
 
@media (max-width:1024px) {
  .btn{ 
    height:52px;
    line-height:50px;
  }
} 
@media (max-width:576px) {
  .btn{ 
    height:44px;
    line-height:42px;
  }
} 
/*==================================================
    Icon Setup
==================================================*/  

.icons{
  display:inline-block;
  position:relative;
  vertical-align:middle; 
  background-size: contain;
  background-repeat:no-repeat;
  background-position: center center;
  transition: all 0.2s ease-in-out;
  opacity: 1;
}
.icons.before:before,
.icons.before:after{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-size: contain;
  background-repeat:no-repeat;
  background-position: center center;
  transition: all 0.2s ease-in-out;
  opacity: 0;
}
.btn .icons.before:before{ opacity: 1; }
.btn .icons.before:after{ opacity: 0; }
.pc .btn:hover .icons.before:before{ opacity: 0; }
.pc .btn:hover .icons.before:after{ opacity: 1; }
 
/**/

.arrow-left,
.arrow-right,
.arrow-up,
.arrow-down{
  position: absolute;
  left: 0;
  top: 0;
  width:5px;
  height:5px;
  vertical-align:top;

  border-top: 1px solid #676767;
  border-left: 1px solid #676767;

   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}



.arrow-left{
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);  
}

.arrow-right{
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);  
}

.arrow-up{
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);  
}
.arrow-down{
   margin-left:1px; 
   -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);  
}
 
 
.container-fluid{
  max-width:100%; 
  padding-left:40px;
  padding-right:40px; 
  position: relative;
  z-index: 9;  
}

.container{ 
  max-width:calc(1160px + 80px); 
  padding-left: 40px;
  padding-right: 40px;
  position:relative;
  z-index:9; 
}

.section-target{
  position: absolute;
  top:-136px;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
}

.section{
  display: block;
  position: relative;
  padding: 60px 0;
}

.py-100{
  padding: 100px 0;
}
.py-70{
  padding:80px 0;
}

.pt-60{
  padding-top: 60px;
}
.pt-50{
  padding-top: 45px;
}

.title-icons{
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 500;
  font-size: var(--body-XL);
  line-height: var(--body-XL-line-height);
  margin-bottom: 25px;
  margin-top: 35px;
  position: relative;
}
.title-icons.md{
  font-size: var(--body-M);
  line-height: var(--body-M-line-height);
}
.title-icons.md.top{
  margin-top:5px; 
  margin-bottom: 15px;
}
.title-icons .icons{
  width: 38px;
  height: 38px;
  border-radius: 4px;
  background-size: 20px;
  display: flex;
  flex-shrink: 0;
}
.title-icons .icons svg,
.title-icons .icons img{
  margin: auto;
  vertical-align: top;
  width:19px;
  height:auto;
}
.title-icons .icons.famous{
  background-color: var(--highlight-color-1-light10);
}
.title-icons .icons.famous svg path{
  stroke: var(--highlight-color-1);
}
.title-icons .icons.calendar{
  background-color: var(--light-blue-10);
}
.title-icons .icons.calendar svg path{
  stroke: var(--primary-color);
} 

.title-icons .icons.blue{
  background-color: var(--light-blue-10);
}
.title-icons .icons.blue svg path{
  stroke: var(--primary-color);
}   
.title-icons .icons.orange{
  background-color: var(--highlight-color-1-light10);
}
.title-icons .icons.orange svg path{
  stroke: var(--highlight-color-1);
}   

.title-icons:hover .seemore {
  color: var(--black);
}
.title-icons:hover .seemore .icons svg path{
  stroke: var(--highlight-color-1);
}
.title-icons-lists{
  display: flex;
  flex-direction: column;
  margin-top:18px;
}
.title-icons-lists .title-icons {
  margin: 0;
  padding: 23px 0;
  width: 100%;
  border-bottom: 1px solid var(--gray-15);
}
.title-icons-lists .title-icons .seemore{
  margin-left: auto;
}

.hgroup .title-icons{
  margin: -10px 0 0 0;
  gap: 15px;
}


.compensate-for-scrollbar{ margin-right: 0 !important } 
.compensate-for-scrollbar .header{ right: 0 } 
body.fancybox-active{ overflow: visible !important;padding-right: 0 !important  }


.fancybox-button--arrow_left > div,
.fancybox-button--arrow_right > div,
.fancybox-button--zoom,
.fancybox-button--play{opacity: 0 !important; pointer-events: none;} 
 
@media (max-width:1280px) {
  .section{padding: 40px 0;}
  .pt-60{padding-top: 40px;}
} 

@media (max-width:1024px) {
  .section{padding:30px 0;}
  .pt-60{padding-top: 30px;}
  .title-icons{margin-bottom: 22px; margin-top:22px;}
  .hgroup .title-icons{margin-top: 0;}

}
@media (max-width:991.98px) {
  .container,
  .container-fluid{
    padding-left:30px;
    padding-right: 30px;
  }

  .title-icons.md.top{margin-bottom: 15px; margin-top: 0;}
  
}

@media (max-width: 670px) {
  .title-icons-lists{
    margin-top: 3px;
  }
  .title-icons-lists .title-icons{
    padding: 15px 0;
  }

  .title-icons.md.top{margin-top:0px;}
}

@media (max-width: 576px) {
  .container{
    padding-left:15px;
    padding-right: 15px;
  }
  .container-fluid{ 
    padding-left:15px;
    padding-right: 15px;
  }
  
  .py-100,
  .py-70{
    padding:45px 0;
  }

  .section{padding:20px 0;}
  .pt-60{padding-top: 20px;}
  .title-icons{margin-bottom: 15px; margin-top:20px;}

  .hgroup .title-icons{margin-bottom:5px; margin-top: 0;}
}

/*==================================================
    Header Setup
==================================================*/  
 
:root {    

  --bs-body-color:var(--black);
  --bs-body-bg:#F8F8FB;
  --bs-body-text-align:left;
  --bs-body-font-weight:300;
  --bs-body-line-height:var(--body-M-line-height);
  --bs-body-font-size:var(--body-M);
  --bs-body-font-family:'FC Iconic', sans-serif;


    
  --animate-duration-2s: all 0.2s ease-in-out;
  --animate-duration-35s: all 0.35s ease-in-out;
  --animate-duration-40s: all 0.40s ease-in-out;
  --animate-duration-45s: all 0.45s ease-in-out;

  --primary-color:#2E3192;
  --light-blue:#6E87C4;
  --light-blue-10:#E2E8F6;
  --light-blue-5:#F8F8FB;

  --green:#44A789;
  --red:#E03434;
  --red-light:#FEE9E9;
   
  --black:#2C2C32;
  --gray-50:#7E838D;
  --gray-25:#ADADBD; 
  --gray-15:#CECEDD;

  --highlight-color-1:#ff5c00;
  --highlight-color-1-light50:#fc9f6b;
  --highlight-color-1-light10:#f6ebe5;
  --highlight-color-2:#8fe4ff;

  --f-300:200;
  --f-400:300;
  --f-500:400;
  --f-600:500; 
  --f-700:600; 
    
  --h1:48px;
  --h2:40px;
  --h3:28px;

  --article-h1:42px;

  --M-H1:28px;
  --M-H2:26px;
  --M-H3:22px;

  --body-XL:20px;
  --body-L:18px;
  --body-M:16px;
  --body-S:14px;
  --body-XS:12px;

  /* line height */
  --H1-line-height:64px;
  --H2-line-height:58px;
  --H3-line-height:42px;

  --M-H1-line-height:42px;
  --M-H2-line-height:40px;
  --M-H3-line-height:34px;

  --body-XL-line-height:38px;
  --body-L-line-height:34px;
  --body-M-line-height:28px;
  --body-S-line-height:26px;
  --body-XS-line-height:18px;
}  


@media (max-width: 1199px) {
  :root{
    --h1:42px;
    --h2:36px;
    --h3:24px;

    --article-h1:36px;
  }
}

@media (max-width: 576px) {
  :root{
    --h1:var(--M-H1);
    --h2:var(--M-H2);
    --h3:var(--M-H3);

    --H1-line-height:var(--M-H1-line-height);
    --H2-line-height:var(--M-H2-line-height);
    --H3-line-height:var(--M-H3-line-height);
  
  }
}
a:hover{  --bs-link-color:var(--light-blue);}
.white{color: #fff !important;}
.grey{color: var(--grey);}
.fw-semibold{font-weight: 600;}
.fs-17{font-size: var(--f-17) !important;}
b, strong{
  font-weight: bold; 
  font-family: inherit;
}
.h1, .h2, .h3, .h4, .h5, .h6, 
h1, h2, h3, h4, h5, h6{   
  margin:0;  
  color:inherit;  
  font-weight:500;
  font-style: normal; 
  line-height: inherit;   
  position: relative;
}   
.nowrap{ white-space: nowrap; }  
h1,.h1{
  font-size: var(--h1);
  line-height: var(--H1-line-height);
  font-weight: 500;
}
h2,.h2{
  font-size: var(--h2);
  line-height: var(--H2-line-height);
  font-weight: 500;
}
h3,.h3{
  font-size: var(--h3);
  line-height: var(--H3-line-height);
  font-weight: 500;
}
h4,.h4{
  font-size: var(--body-XL);
  line-height: var(--body-XL-line-height);
  font-weight: 500;
}
h5,.h5{
  font-size: var(--body-M);
  line-height: var(--body-M-line-height);
  font-weight: 500;
}
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 
  
  :root{
    --f-300:300;
    --f-400:400;
    --f-500:500;
    --f-600:600; 
  }

} 
 

 @media (max-width:1380px) {
  :root{}
 }
 
@media (max-width:1280px) {
  :root{ }
  
}
 
 
.header,
.navbar-brand img{
  transition: all 0.45s;
}
.header{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  padding: 0;
  height: auto;
  z-index: 1040;      
  display: block;        
} 
 
.header .container,
.header .container-fluid{  
  display: flex;   
  align-items: center; 
} 


.navbar-brand{
  margin:auto 0; 
  padding: 0;  
  position: relative;  
  flex-shrink: 0;
  z-index: 200;
  width: 296px;
}
.navbar-brand a{
  display: block;
  position: relative;
}
.navbar-brand img,
.navbar-brand svg{width: 100%; height: auto;} 
 
.navbar-toppage{
  --navbar-toppage-height:48px;
  background-color: var(--primary-color);
  height: var(--navbar-toppage-height);
  color: #fff; 
  display: block;
  position: relative;
  z-index: 10;
}
.navbar-toppage:before{
  content: '';
  position: absolute;
  pointer-events: none;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(277.62deg, rgba(110, 135, 196, 0.536) 22.04%, rgba(110, 135, 196, 0) 74.94%);
}
.navbar-toppage .container-fluid{
  display: flex;
}
.nav-general{
  display: flex;
  gap: 32px;
  position: relative;
}
.nav-general li a,
.nav .nav-user .dropdown-menu a{
  font-size: var(--body-S);
  line-height: var(--body-S-line-height);
  height: var(--navbar-toppage-height);
  display: flex;
  align-items: center;
  font-weight: 500;
  color: #fff;
}
.nav-general li a:hover{opacity: 0.8;}
.nav li.nav-user{
  display: flex;
  align-items: center;
  gap: 5px;
}
.nav .icon-user.before{
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: var(--light-blue);
 
  flex-shrink: 0;
  margin-right:15px;
}

.nav.before-login .icon-user.before{
  background-color: transparent;
  margin-right: -3px;
  margin-top: -1px;

}

.nav .icon-user.before:before,
.nav .icon-user.before:after{
  background-size: 14px;
}

.nav .icon-user.before:before{
  background-image: url(/img/icons/icon-user-white.svg);
  opacity: 1;
}
.nav .icon-user.before:after{
  background-image: url(/img/icons/icon-user-orange.svg);
  opacity: 0;
}
.nav.before-login li:hover .icon-user.before:before{opacity: 0;}
.nav.before-login li:hover .icon-user.before:after{opacity: 1;}

.nav-general a[data-bs-toggle]{ 
  position: relative;
}
.nav a[data-bs-toggle] .username > span{
  display: inline-block;
  position: relative;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 140px;
  vertical-align: top;
}
.nav a[data-bs-toggle] .username:after {
  content: '';
  width: 14px;
  height: 14px;
  display: inline-block;
  flex-shrink: 0;
  margin-left:8px;
  background-image: url(/img/icons/icon-arrow-down-white.svg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  position: relative;
  top: 2px;
  transition: all 0.35s;
} 
.nav li:hover >  a .username:after {
  transform: rotate(-180deg);
}


.nav-general .dropdown-menu{
  z-index: 1010; 
  left: auto;
  right: 0; 
  margin-right:0;
  
}
.nav-general li:hover .dropdown-menu{top:calc(100% - 7px) !important;}
.nav-general .dropdown-menu a,
.nav .nav-user .dropdown-menu a{
  color: var(--black);
}
.nav .icon-user .icons{
  width: 14px;
  height: 14px;
  background-image: url(/img/icons/icon-member-levels-orange.svg);
  position:absolute;
  bottom: 0;
  right: -5px;
  z-index: 10;

}
.dropdown-menu .icons{
  /* width: 15px;
  height: 15px; */
  flex-shrink: 0;
  /* margin-right: 10px; */
  background-color: transparent !important;
  transition: none !important;
}
.dropdown-menu li .icon-user{background-image: url(/img/icons/icon-user.svg);}
.dropdown-menu li .icon-lock{background-image: url(/img/icons/icon-lock.svg);}
.dropdown-menu li .icon-logout{background-image: url(/img/icons/icon-logout.svg);}
.navbar-main{
  --navbar-main-height:88px;
  background-color: #fff;
  height: var(--navbar-main-height);
  color: var(--black); 
  display: block;
  position: relative;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.04);
}
.navbar-main .container-fluid{
  height: 100%;
}

.nav-main{
  display: flex;
  margin-left: auto;
  gap:28px;
  align-items: center;
} 
.nav-main > li {
  display: flex; 
}
.nav-main > li > a{
  display: flex; 
  font-size: var(--body-M);
  line-height: var(--body-M-line-height);
  font-weight: 500;
  color: var(--black);
  align-items: center;
  padding: 14px 5px;
}
.nav-main > li .vr{
  margin: auto 0;
  opacity: 1;
  background-color: var(--gray-25);
  height:24px;
}
.nav-main > li.nav-search > a{
  padding: 0;
}
.nav-main > li.nav-lang > a{
  padding: 0;
  position: relative;
}
.nav-main > li.nav-lang > a:after{
  content: '';
  width: 14px;
  height: 14px;
  margin-left: 12px;
  background-image:url(/img/icons/icon-arrow-down.svg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}

.nav-main > li > a:hover{opacity: 0.8;}
.nav-main .icons{
  width: 14px;
  height: 14px;
  margin-right: 7px;
}
.nav-main .icon-search{background-image: url(/img/icons/icon-search.svg);}
.nav-main .icon-globe{background-image: url(/img/icons/icon-globe.svg);}
.nav-main .icon-th{background-image: url(/img/icons/icon-th.svg);}
.nav-main .icon-en{background-image: url(/img/icons/icon-en.svg);}

.nav-main li.item-button{display: none;}
.nav-main > li.nav-lang + li.item-line{display: none;}
.dropdown-menu{
  border:0;
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.05);
  margin: 0;

  opacity: 0;
  display: block;
  transition: all 0.35s;
  top: 110%;
  pointer-events: none;
}

.pc li:hover > .dropdown-menu{
  opacity: 1;
  top: 100%;
  pointer-events: all;
}

.dropdown-menu a{ 
  font-size: var(--body-M);
  font-weight: 500;
  padding: 10px 20px;
  display: flex;
  align-items: center;
  color: var(--black);
  cursor: pointer;
}
.dropdown-menu .icons{
  width: 15px;
  height: 15px;
  margin-right: 10px;
}
.dropdown-menu a:hover{
  background-color: var(--light-blue-5)
}
li.nav-lang .dropdown-menu {
  left: auto;
  right: 0;
  width: 120px; 
  padding: 10px 0;
  min-width: 0;
}
li.nav-lang .dropdown-menu li a{ 
 
  text-transform: uppercase;
}
li.nav-lang .dropdown-menu .icons{
  margin-right: 10px;
}
 
@media (min-width:1101px) {
  .nav-main .nav-user{display: none !important;}
}
 
/*==================================================
   Mobile 
==================================================*/  

@media (max-width:1199px) {
  .navbar-brand{
    width: 260px;
  }
  .nav-general{
    gap: 26px;
  }
  .nav-main{
    gap: 22px;
  }
}

@media (max-width:1100px) {
  .navbar-toppage{
    height: 4px;
    background: linear-gradient(90deg, #2E3192 50%, #6E87C4 100%);
  }
  .navbar-toppage:before{display: none;}
  .navbar-toppage .container-fluid{display: none;}

  .header .nav-main > li.item-link,
  .header .nav-main li.item-line,
  .header .nav-main li.nav-lang{display: none;}

  .navbar-main{
    --navbar-main-height:70px;
  }
  .nav-main .nav-search .text{display: none;}
  .nav-main .icon-search{
    width:20px;
    height:20px;
    margin-right: 0;
  }

  .nav li.nav-user .dropdown-menu{
    left: auto;
    right: -5px;
    border-radius: 0 0 5px 5px;
  }
  .nav li.nav-user .icon-user .icons{
    right: -12px;
  }
  /* .nav .icon-user.before{background-color: var(--highlight-color-1);}
  .nav .icon-user .icons{background-image: url(/img/icons/icon-member-levels-blue.svg);} */

  .nav li.nav-user.before-login .icon-user.before{
    background-color:var(--gray-15);
  }
  .nav li.nav-user .icon-arrow{
    background-image: url(/img/icons/icon-arrow-line-right-black.svg);
    background-size: 12px;
  }
  .nav li.nav-user .icon-jumpto{
    background-image: url(/img/icons/icon-jumpto-black.svg); 
  }
  .btn-menu{
    width: 25px;
    height: 25px;
  }
   
  .btn-menu .icons{
    width: 25px;
    height: 25px;
  }

  .nav-main li.item-button{display: block;}
  .btn-menu{
    width: 24px;
    height: 24px;
    display: flex;
    padding: 0 !important;
    border:0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
  }
  .btn-menu .icons{
    width: 22px;
    height: 22px;
    margin: auto;
    flex-shrink: 0;
    background-image: url(/img/icons/icon-menu.svg);
  }
  .btn-menu .icon-menu-close{
    background-image: url(/img/icons/icon-menu-close.svg);
  }
  .nav-main{gap:20px;} 

  /**/

  .dropdown.user-slide{
    position: static;
  }
  .dropdown.user-slide .dropdown-menu{
    position: fixed;
    top: 5px;
    left: 0;
    bottom: 0; 
    width: var(--bs-offcanvas-width);
    z-index: 1000;
    background-color: var(--light-blue-10);
    opacity: 1;
    display: flex;
    border-radius: 0; 
    padding: 0;

    transition: transform .5s ease-in-out;
    transform: translateX(-100%);
    pointer-events: none;
  }
  .dropdown.user-slide .dropdown-menu.show{
    transform: translateX(0);
    pointer-events: all;
  }

  .nav .icon-user.before{
    margin-right: 0;
  }
}
 
@media (max-width:991.98px) { 
  .navbar-main{
    --navbar-main-height:70px;
  }

  .nav .nav-user .dropdown-menu{
    min-width: 140px;
  }
  .nav-general li a, 
  .nav .nav-user .dropdown-menu a{
    font-size: var(--body-XS);
    line-height: var(--body-XS-line-height);
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .nav-user .dropdown-menu .icons {
    width: 12px;
    height: 12px;
    margin-right: 10px;
  }
  
}

@media (max-width:720px) {
  .nav-main .nav-lang,
  .nav-main .item-line{display: none;}
 
}

@media (max-width:576px) {
  .navbar-main{
    --navbar-main-height:56px;
  }
  .navbar-brand{
    width: 200px;
  }
  .nav-main{gap:10px;} 
  .nav-main .icon-search{
    width:16px;
    height:16px;
  }
  .btn-menu{
    width: 20px;
    height: 20px;
  }
   
  .btn-menu .icons{
    width: 20px;
    height: 20px;
  }
}

.offcanvas-menu{
  border: 0 !important;
  --bs-offcanvas-bg:var(--light-blue-10); 
  transition: transform .5s ease-in-out;
}
.offcanvas-menu:before{
  content:'';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #2E3192 50%, #6E87C4 100%);
}

.offcanvas-menu .offcanvas-body{
  display: flex;
  flex-direction: column;
  padding: 65px 0 0 0;
}
.offcanvas-menu.offcanvas-start{
  --bs-offcanvas-width:70%
}
.nav-menu{
  flex-direction: column;
}
.nav-menu li {
  position: relative;
  padding: 0 50px;
}
.nav-menu li a{
  color: var(--black);
  display: block;
  font-weight: 500; 
  padding: 8px 0;
  background-color:transparent !important
}
.nav-menu > li.active > a{color: var(--gray-50);}

.nav-menu.xl li a{
  font-size: var(--body-XL);
  line-height: var(--body-XL-line-height);  
}
.nav-menu.m{
  margin-top: 30px;
}
.nav-menu.m li a{
  font-size: var(--body-M);
  line-height: var(--body-M-line-height); 
  
}
.nav-menu.m.bottom{
  margin-top: auto; 
}
.nav-menu.m.bottom hr{
  opacity: 1;
  border-color: var(--gray-15);
  margin:8px 0 0;
}
.nav-menu.m.bottom li .d-flex{
  display: flex;
  padding: 8px 0;
  gap: 10px;
  align-items: center;
}
.nav-menu.m .icons{
  width: 14px;
  height: 14px;
}
.nav-menu.m .icon-user{background-image: url(/img/icons/icon-user.svg);}
.nav-menu.m .icon-globe{background-image: url(/img/icons/icon-globe.svg);}
.nav-menu.m .lang a.active{color: var(--gray-50);}
.nav-menu.m.bottom hr{margin-left: -50px;margin-right: -50px;}

.nav-menu li.goback a{
  color: var(--gray-50);
  align-items: center;
  justify-content: center;
  padding: 0 0 !important; 
  height: 74px;
  line-height: normal;
  background-color: transparent !important;
}
.nav-menu li.goback a .icons{
  width: 18px;
  height: 18px;
  background-image: url(/img/icons/icon-arrow-left.svg);
  position: absolute;
  left: 50px;
  top: 50%;
  margin-top: -9px;
}
.btn-close{
  position: absolute;
  top: 25px;
  right: 25px;
  padding: 0;
  width: 26px;
  height: 26px;
  opacity: 1;
  z-index: 1030;
}


@media (max-width:576px){
  .offcanvas-menu.offcanvas-start{
    --bs-offcanvas-width:100%
  }

  .nav-menu li {padding: 0 15px;} 
  .nav-menu.m{
    margin-top: 20px;
  }

  /* .offcanvas-menu .offcanvas-body{
    padding-top: 55px;
  } */
  .nav-menu.m.bottom hr{margin-left: -15px;margin-right: -15px;}

  .btn-close{ 
    top: 17px;
    right: 10px;
    background-size: 14px;
  }

  .nav-menu li.goback a{
    height: 68px;
  }
  .nav-menu li.goback a .icons {
    width: 14px;
    height: 14px;
    margin-top: -7px;
    left: 15px;
  }

  .dropdown.user-slide .dropdown-menu{top: 4px;}
}

@media (max-width:350px){
  .nav-menu.xl li a {
    font-size: var(--body-M);
    line-height: var(--body-M-line-height);
  }
  .nav-menu.m li a {
    font-size: var(--body-S);
    line-height: var(--body-S-line-height);
  }
  .nav-menu.m.bottom hr{margin-top: 7px;}

  .nav-menu.m.bottom li .d-flex{
    padding:5px 0;
  }

  .nav-menu li.goback a{height: 48px;}

  .nav-menu li a {
    padding: 5px 0;
  }
}
/*==================================================
   Section
==================================================*/  
 
.page{
  display: block;
  position: relative;
  overflow: hidden;     
  padding-top: 136px;
} 
 
@media (max-width:1100px) {
  .page{
    padding-top: 74px;
  }
}

@media (max-width:991.98px) {
  .page{
    padding-top: 74px;
  }
}


@media (max-width:576px) {
  .page{
    padding-top: 60px;
  }
}

.preload{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color:#fff;
  z-index: 1090; 
  display:flex;   
} 


.loader {
  width: 34px;
  height:34px;
  margin:  auto;
  display: block;
  border-top: 3px solid var(--primary-color);
  border-right: 3px solid var(--light-blue-10);
  border-bottom: 3px solid var(--light-blue-10);
  border-left: 3px solid var(--light-blue-10);
  border-radius: 100px;
  animation: spin 1s infinite linear;
}
 
 
@keyframes spin {
  100% {
    transform: rotate(360deg);
  }
}
.section-full{
  min-height: 100vh;
  min-height: calc(var(--vhs, 1vh) * 100) !important;
  display: flex;
}
 
.background{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;

  pointer-events: none;

  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.background.fixed{
  background-attachment: fixed;
}
.device .background.parallaxie,
.device .background.fixed{
  background-attachment: scroll !important;
  background-position: center center !important;
}

@media (max-width:1199px) {
  .background.parallaxie{
    background-attachment: scroll !important;
    background-position: center center !important;
  }
}
 
.section{ 
  position: relative;
}

.section.h-full{
  min-height: 100vh;
}

.section-title{ 
  display: block;
  position: relative;  
}    
.card{
  border:0;
  border-radius: 0;
  background-color: transparent;
  position: relative;
}
.card-photo{
  position: relative;
  overflow: hidden;
  display: block; 
 
}

.card-photo .photo{
  display: block;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  transition: all 0.35s ease 0s;  
}
.card-photo .photo img{
  width: 100%
}

.card-photo.rounded,
.card-photo.rounded .photo{
  border-radius: 10px;
}
.card-body{color: inherit;}
 
.card-link{
  position: absolute !important;
  top: 0;
  left: 0; 
  right: 0;
  height: 100%;
  z-index: 100;
}
.card h3,
.card p,
.card .card-body{transition: all 0.2s ease 0s;}
 
strong{font-weight: 500;}
 

@media (max-width:1280px) { }
 
@media (max-width:991.98px) { }

@media (max-width:670px) { }

@media (max-width:576px) { }

/*==================================================
   Modal
==================================================*/ 
 
.modal .btn-close{
  width: 38px;
  height: 38px; 
  border-radius: 0;
  background-size: contain; 
  top:35px;
  right: 40px;
  transition: all 0.25s;
  opacity: 1 !important;
  background: none;
}

.modal .btn-close:before,
.modal .btn-close:after{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  transition: all 0.25s;
}

.modal .btn-close:before{background-image: url(/img/icons/icon-modal-close.svg); opacity: 1;}
.modal .btn-close:after{background-image: url(/img/icons/icon-modal-close-orange.svg); opacity: 0;}

.pc .modal .btn-close:hover:before{opacity: 0;}
.pc .modal .btn-close:hover:after{opacity: 1;}
.modal-backdrop{
  background-color: var(--light-blue-10);
  opacity: 1; 
}
.modal-backdrop.show{
  opacity: 1;
}

.modal.xl .modal-dialog{
  max-width: 1160px;
}

.modal.xl .modal-content{
  padding:70px 0;
  background-color: transparent !important;
  border:0
}
 
.modal.modal-static .modal-dialog{transform: scale(1);}

 
/*==================================================
   dropdown select
==================================================*/  

.dropdown.select.event{
  max-width:385px;
  margin-bottom: 40px;
}
.dropdown.select.event a[data-bs-toggle]{
  font-size: var(--h3);
  line-height: var(--H3-line-height);
  font-weight: 500;
  border-bottom-color: var(--gray-25);
  width: 100%;
  display: block;
  position: relative;
  color: var(--black) !important;
}
.dropdown.select.event .dropdown-menu > li >a,
.dropdown.select.event .dropdown-menu > li >span{
  padding: 10px 20px;
}

@media (max-width:1199px) {
  .dropdown.select.event a[data-bs-toggle]{
    font-size: var(--body-XL);
    line-height: var(--body-XL-line-height);
  }
  .dropdown.select.event {
    max-width: 295px;
    margin-bottom: 30px;
  }

  .modal .btn-close {
    width: 30px;
    height: 30px;
    padding:0;
    top: 25px;
    right: 25px;
  }
}
@media (max-width:991.98px) {
  .modal .btn-close { 
    padding:0;
    top: 20px;
    right: 20px;
  }
}

@media (max-width:670px) {
  .modal .btn-close {
    width: 24px;
    height: 24px; 
    top: 15px;
    right: 15px;
  }

  .dropdown.select.event{
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 100%;
  }

}

/*==================================================
   Search Data
==================================================*/ 

.search-container{
  display: flex;  
  flex-direction: column;
  gap:var(--input-gap);

  --input-gap:25px;
}

.search-container .collapsing{
  transition: none !important;
  height: auto !important;
}

.search-container .collapse-body{
  
  display: flex;
  flex-direction: column;
  gap:var(--input-gap);
}
.search-container .collapse-body.show,
.search-container .collapse-body.collapsing{
  display: flex;
}

.search-advance-box{
  display: flex;
  flex-direction: column;
  gap:var(--input-gap);
}
.input-search-group{
  display: flex;
  border-radius: 5px;
  background-color: #fff;
  padding: 15px 0 15px 15px ; 
  height: var(--input-search-height);
  --input-search-height:69px;
  background-color: #fff;
  height: 69px;
}

.input-search-group .form-group{
  margin: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  padding-right:20px;
}
.input-search-group .form-group label{
  font-size: var(--body-XS);
  line-height:1;
  color: var(--light-blue);
  font-weight: 500;
  margin: 0%;
  flex-shrink: 0;
}
.input-search-group .form-control{
  border:0;
  padding: 0;
  height: 25px;
  line-height: 25px;
  box-shadow: none !important;
  margin-top: 2px;
}
.input-search-group .form-group:not(:first-child){
  border-left: 1px solid var(--light-blue-10);
  padding-left:18px;
}
.input-search-group .form-group.w-235{
  width: 235px;
  flex-shrink: 0;
}
.input-search-group .form-group.w-325{
  width: 325px;
  flex-shrink: 0;
}
.input-search-group .dropdown.select a[data-bs-toggle]{
  border: 0 !important;
  width: 100%;
  display: block;
  margin-top: 2px;
  font-weight: 300;
}
.input-search-group .dropdown.select a[data-bs-toggle]:before{
  top: 2px;
}
.input-search-group .dropdown.select  .dropdown-menu{
  top: calc(100% + 15px) !important;
  width:auto; 
  left: -15px;
  right: -20px;
}
.search-advance-box .input-search-group .dropdown.select  .dropdown-menu{
  top: calc(100% + 11px) !important;
}
.input-search-group .form-button{
  
  display: block;
  position: relative;
  height: var(--input-search-height);
  margin-top: -15px;
}

.input-search-group .btn-search{
  display: flex;
  height: var(--input-search-height);
  line-height: var( --input-search-height);
  border:0;
  padding: 0;
  width: 130px;
  border-radius: 0 5px 5px 0;
  display: flex;
  align-items: center;
  justify-content: center;

  
}
.input-search-group .btn-search .icons{
  width: 14px;
  height: 14px;
  background-image: url(/img/icons/icon-search-white.svg);
  margin-right: 10px;
}

.dropdown.suggest .dropdown-menu a{
  display: block;
  position: relative;
  padding-left:45px !important;
}
.dropdown.suggest .dropdown-menu a:before{
  content: '';
  position: absolute;
  top: 19px;
  left: 20px;
  width: 14px;
  height: 14px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  background-image: url(/img/icons/icon-famous-gray.svg);
}
.dropdown.suggest .dropdown-menu .autocomplete{display: none;}
.dropdown.suggest.has-value .dropdown-menu li:not(.autocomplete){display: none;}
.dropdown.suggest.has-value .dropdown-menu .autocomplete{display: block;}

.dropdown.suggest.has-value .dropdown-menu .autocomplete a {
  color: var(--gray-50);
  padding-left: 20px !important;
}
.dropdown.suggest.has-value .dropdown-menu .autocomplete a::before{display: none;}
.dropdown.suggest .dropdown-menu  a .keyword{
  color: var(--black); 
}

.dropdown.suggest.main .dropdown-menu {
  opacity: 0;
  pointer-events: none;
}
.dropdown.suggest.main.has-value .dropdown-menu.show {
  opacity: 1;
  pointer-events: all;
}

.dropdown .btn-clear{
  position: absolute;
  top: -2px;
  right: 0;
  width: 20px;
  height: 20px; 
  background-image: url(/img/icons/icon-clear.svg);
  z-index:10;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
}

.dropdown.has-value .btn-clear{
  opacity: 1;
  pointer-events: all;
}

.dropdown.suggest .form-control{
  width: calc(100% - 30px);
}
.dropdown.suggest .dropdown-menu a#selectedPlaceHighlight .keyword{color: var(--highlight-color-1);}
.dropdown.suggest .dropdown-menu a#selectedPlaceHighlight:before{background-image: url(/img/icons/icon-famous.png)}

.dropdown.suggest .dropdown-menu a#selectedPlaceHighlightModal .keyword{color: var(--highlight-color-1);}
.dropdown.suggest .dropdown-menu a#selectedPlaceHighlightModal:before{background-image: url(/img/icons/icon-famous.png)}
.search-advance-box.dropdown{
  display: flex;
}
.search-advance-box a[data-bs-toggle]{
  position: relative;
  display: flex;
  align-items: center;
  gap: 15px;
  font-size: var(--body-L);
  list-style-type: var(--body-L-line-height);
  font-weight: 500;
  color: var(--black);
  margin-left:auto;
}
.search-advance-box > a[data-bs-toggle]{ margin-bottom: 15px;}
.search-advance-box a[data-bs-toggle] .icons{
  width: 40px;
  height: 40px;
  border-radius: 50%; 
  background-image: url(/img/icons/icon-search-filter.svg);
  background-size: 20px;
  background-color: var(--primary-color);
}

.search-advance-box a[data-bs-toggle]:after{
  content: '';
  width: 14px;
  height: 14px;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url(/img/icons/icon-arrow-select.svg);
  transition: all 0.25s;

}
.search-advance-box a[data-bs-toggle][aria-expanded="true"]:after{
  transform:rotate(-180deg);
}

.input-search-group.continent,
.input-search-group.country{display: none;}

@media (max-width:1199px) {
  .modal.xl .modal-content{ 
    padding-left: 60px;
    padding-right: 60px;
  }
}

@media (max-width:991.98px) {
  .modal.xl .modal-content{ 
    padding-left: 40px;
    padding-right: 40px;
  }

  .input-search-group .form-group.w-325{
    width: 240px;
  }
  .input-search-group .form-group.w-235{
    width: 180px;
  }
  .input-search-group .btn-search{
    width: 110px;
  }
}

@media (max-width:720px) {
  .input-search-group .form-group.w-235{
    width: 160px;
  }
}

@media (max-width:670px) {
  .modal.xl .modal-content{ 
    padding-left: 20px;
    padding-right: 20px;
  }
  .search-container{
    --input-gap:10px;
  }
  .search-advance-box a[data-bs-toggle]{
    font-size: var(--body-M);
    line-height: var(--body-M-line-height);
    gap: 10px;
    margin-top: 10px;
  }
  .search-advance-box a[data-bs-toggle] .icons {
    width: 28px;
    height: 28px;
    background-size: 14px;
  }

  .input-search-group{ 
    flex-wrap: wrap;
    height: auto;
    padding: 0;
    background-color: transparent;
    gap:8px;
  }

  .input-search-group .form-group:not(:first-child){
    border-left: 0;
    border-top: 1px solid var(--light-blue-10);
    padding: 0;
  }
  .input-search-group .form-group{
    padding: 10px !important;
    height: 60px;
    background-color: #fff;
    border-radius: 5px;
  }
  .input-search-group .form-group.month,
  .input-search-group .form-group.year{
    width: calc(50% - 4px) 
  }

  .input-search-group .form-group.location{
    width: 100%;
  }

  .input-search-group .form-group.w-325{
    width: 100%;
  }

  .input-search-group .form-button{
    margin: 0;
    height: auto;
    /* height: 60px; */
    width: 100%;
  }
  .input-search-group .btn-search{
    width: 100%;
    border-radius: 5px; 

    height:50px;
    line-height: 48px;
    margin-top: 1px;
  }

  .input-search-group .btn-search .icons{
    position: absolute;
    top: 50%;
    left: 20px;
    margin-top: -7px;
  }

  .input-search-group .dropdown .dropdown-menu{
    left: -10px !important;
    right: -10px !important;
    top: calc(100% + 7px) !important;
    min-width: 0;
  }

  .input-search-group .dropdown.select  .dropdown-menu{
    top: calc(100% + 10px) !important; 
  }
  .search-advance-box .input-search-group .dropdown.select  .dropdown-menu{
    top: calc(100% + 7px) !important;
  }
}

@media (max-width:576px) {
  .input-search-group .btn-search{ 
    height:44px;
    line-height: 42px;
  }

  .input-search-group .form-group{
    height: 52px;
    padding-top: 8px !important;
  }
  .input-search-group .form-control{
    margin-top: 0;
  }
  .input-search-group .form-group label{
    margin-top: 1px;
  }

  .dropdown.select.venue [data-bs-toggle] + .icon-arrow{top: 0;}

}

/*==================================================
   Banner
==================================================*/  
.section-banner{
  padding: 0 !important;
}
.section-banner:hover .swiper-button,
.swiper-overflow:hover .swiper-button{
  opacity: 1;
}
.swiper-button{
  opacity: 0;
  transition: all 0.25s;
}
.swiper-button .icons{
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.swiper-button .icons:before{opacity: 1;}
.swiper-button .icons:after{opacity: 0;}

.swiper-button:hover .icons:before{opacity: 0;}
.swiper-button:hover .icons:after{opacity: 1;}
.swiper-button:hover .icons{
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.08);
 
}
.swiper-button .icons:before{background-image: url(/img/icons/icon-banner-arrow.svg);}
.swiper-button .icons:after{background-image: url(/img/icons/icon-banner-arrow-orange.svg);}
.swiper-button-next:after, .swiper-button-prev:after{
  display: none;
}
.swiper-button-prev .icons{
  transform:rotate(180deg);
}
.swiper-banner.rounded,
.swiper-banner.rounded .rounded,
.swiper-banner.rounded .background{
  border-radius: 5px !important;
}
.swiper-pagination.md{bottom: 0;}

.swiper-pagination-lock{ display: block;}

.banner-in-content .swiper-button{
  width: 38px;
  height: 38px;
  margin-top: -19px;
}
.banner-in-content .swiper-button.sm{
  width: 24px;
  height: 24px;
  margin-top: -12px;
}

.banner-in-content .swiper-button-prev.sm{left: 20px;}
.banner-in-content .swiper-button-next.sm{right: 20px;}
.swiper-overflow{
  position: relative;

}
.banner-in-content{
  margin-top:60px;
}

.swiper-banner .swiper-wrapper{
  position: absolute;
  top: 0;
  left: 0;
  right:0;
  bottom: 0;
}
.swiper-banner .swiper-slide img{
  height: 100%; 
  object-fit: cover;
  object-position: 50% 50%;
}
.swiper-banner .swiper-slide img.pointer{cursor: pointer;}
@media (max-width:1280px){
  .banner-in-content {
    margin-top: 50px;
  }
}
@media (max-width:1199px) {
  .swiper-pagination{
    bottom: 0;
  }

  .swiper-pagination-bullet{
    width: 20px;
  }

  .device .swiper-button{display: none !important}

  .swiper-pagination.md{bottom: -5px;}
  .banner-in-content {margin-top: 40px;}
}
@media (max-width:670px) {
  .swiper-pagination-bullet{
    width: 10px;
    height: 10px;
    margin: 0 3px;
  }
  .swiper-pagination-bullet:before{
    height: 1px;
  }

  .swiper-banner.rounded,
  .swiper-banner.rounded .rounded{
    border-radius: 3px !important;
  }

  .banner-in-content {margin-top:20px;}
}

/*==================================================
   card event
==================================================*/  
.hgroup{
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid var(--gray-15);
  margin: -10px 0 0;
  padding: 15px 0;
}

.seemore {
  color: var(--gray-50);
  font-size: var(--body-S);
  line-height: var(--body-S-line-height);
  display: flex; 
  gap: 7px;
  font-weight: 500;
  transition: all .25s;
}
.seemore .icons{
  margin: auto 0;
  width: 14px;
  height: 14px;
}
.seemore .icons svg{
  width: 100%;
  height: auto;
  vertical-align: top;
}
.seemore .icons svg path{
  stroke:  var(--gray-50);
}
.seemore:hover {
  color: var(--black);
}

.seemore:hover .icons svg path{
  stroke:  var(--highlight-color-1);
}
 
.card-event{
  display: flex;
  flex-direction: column;
  background-color:rgba(255, 255, 255, 0.85);
  width: 208px;
  position: relative;
  transition: all 0.25s;
  flex-shrink: 0;
}
.card-event:hover{
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.05);
  background-color:rgba(255, 255, 255, 1);
}
.card-event .photo{
  width: 208px;
  height: 208px;
  background-color: #ccc;
  
}
.card-event:not(.lg) .photo{background-size: contain;}
.card-event .card-body{
  display: flex;
  flex-direction: column;
  padding: 10px;
}
.card-event .date,
.card-event .infos{
  font-size: var(--body-XS);
  line-height: var(--body-XS-line-height);
  color: var(--highlight-color-1);
  font-weight: 500;
  display: flex;
  margin-bottom:7px;
  margin-top: 7px;
}
.card-event .date .icons,
.card-event .infos .icons{
  width:14px;
  height: 14px;
  flex-shrink: 0;
  
  margin-right: 5px;
  top: 2px;
}
.card-event .date .icons{
  background-image: url(/img/icons/icon-calendar.svg);
}
.card-event h3{
  font-size: var(--body-M);
  line-height: var(--body-M-line-height);
  font-weight: 500;
  margin-bottom:8px;
  -webkit-line-clamp: 3;
}
.card-event h3 a{color: inherit;}
.card-event hr{
  border-color: var(--light-blue-10);
  margin-top: auto;
  margin-bottom: 10px;
  opacity: 1;
}

.card-event .card-button{
  position: relative;
  z-index: 120;
  padding: 20px 10px 0;
  width: 100%;
}
.card-event .btn{
  height: 44px;
  line-height: 42px;
  padding: 0;
  width: 100%;
  
}
.card-event .btn .icons{
  width: 14px;
  height: 14px;
}

.card-event .card-footer{
  padding: 10px 0;
  border-top: 1px solid var(--light-blue-10);
  margin-left:10px ;
  margin-right: 10px;

  color: var(--gray-50);
  font-size: var(--body-XS);
  line-height: var(--body-XS-line-height);
  display: flex; 
  z-index: 200;
}
 
.card-event .card-footer[data-bs-toggle]{cursor: pointer; transition: all 0.25s;}
.card-event .card-footer .text{
  display: inline-block;
  -webkit-line-clamp: 2;
  width: 100%;
}
.card-event .card-footer .icons{
  
  width: 14px;
  height: 100%;
  background-size: 12px;
  top: -1px;
  margin-right:7px;
  flex-shrink: 0;
  background-position:  50% 4px;
}
.card-event .card-footer.venue .icons{
  background-image: url(/img/icons/icon-vanue.svg);
}
.card-event .card-footer .icon-clock{
  background-image: url(/img/icons/icon-clock.svg);
  background-size: contain !important;
  top: -3px;
}

.card-event .card-footer[data-bs-toggle]:hover{color: var(--black);}
.card-event .card-footer.venue[data-bs-toggle]:hover .icons{background-image: url(/img/icons/icon-vanue-orange.svg);}
.card-event.lg .card-footer{
  padding-top: 12px;
  padding-bottom: 12px;
}
.card-event.lg .card-footer .icons{height: auto;}
[data-bs-toggle="modal"]{cursor: pointer;}
.card-event h3,
.card-event .location .text{
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  
  -webkit-box-orient: vertical;
}
.card-event.lg {
  max-width: 100%;
  height: 100%;
  width: 100%;
}
.card-event.lg h3{
  -webkit-line-clamp: 2;
  margin-top: 2px;
}
.card-event.lg .photo{
  width: 100%;
  height: 100%;
}
.card-event.lg .location .icons{
  height: auto;
}
.card-event.lg .date{
  color: var(--black);
  margin: auto 0 2px;
}
.card-event.lg .date .icons{
  background-image: url(/img/icons/icon-calendar-black.svg);
}
.card-event.lg .card-body {
  padding-left: 15px;
  padding-right: 15px;
}
.card-event.lg .card-footer{
  margin-left: 15px;
  margin-right: 15px;
}
.card-event .infos{
  color: var(--black);
  overflow: hidden;

}
.card-event .infos .icons{flex-shrink: 0;}
.card-event a.infos{
  display: flex;
  gap: 3px;
  margin-top: auto;
  padding-top: 7px;
}
.card-event a.infos .text{
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
} 
.card-event .infos .icon-link{background-image: url(/img/icons/icon-link-black.svg);}
.card-event .infos:hover .icon-link{background-image: url(/img/icons/icon-link-orange.svg);}
.card-event .infos .icon-article{background-image: url(/img/icons/icon-article-black.svg);}
.card-event .infos:hover .icon-article{background-image: url(/img/icons/icon-article-orange.svg);}
.event-lists{
  display: flex;
  gap:30px;
  padding-bottom: 20px;
  
}
.event-lists.grid .card-event .photo{
  width: 100%;
  height: 100%;
}
.scrollbar-group{
  position: relative;
  overflow: hidden;
  margin-bottom: 10px;
  
}
.scrollbar-inner{
  display: block;
  position: relative;
  overflow: hidden;
  overflow-x: auto;
  margin-bottom: -20px;
  -webkit-overflow-scrolling: touch; 
}

.scrollbar-group.event{
  overflow: visible;
}

.event-lists.grid{
  flex-wrap: wrap;
  padding-bottom: 0;
}
.event-lists.grid .card-event{height: 100%;}
.event-lists.grid .col{flex: none;}
.event-lists.grid .col:last-child{margin-right: auto;}
@media (max-width:1280px) {
  .hgroup{
    margin: -10px 0 0;
    padding:13px 0;
  }

  .event-lists.grid{
    gap: 0;
    max-width:none;
    --bs-gutter-y: 2.5rem;
    --bs-gutter-x: 1.5rem;
    
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x));
  }
  .event-lists.grid .col{
    width: 20%;
    flex: 0 0 auto;

    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-top: var(--bs-gutter-y);
  }
  .event-lists.grid .card-event{
    height: 100%;
    width: 100%;
  }
  .event-lists.grid .card-event .photo{width: 100%;}
}
@media (max-width:1220px) {
  .scrollbar-group.event{
    overflow: hidden;
  }
  .scrollbar-group.event{
    margin-left: -40px;
    margin-right: -40px; 
  }
  .scrollbar-group.event .scrollbar-inner{
    padding-left: 40px;
  } 
}

@media (max-width:1110px) {
  .event-lists{gap: 25px;}
  .event-lists.grid .col{
    width: 25%;
  }
}

@media (min-width:691px) and (max-width:800px) {
  .card-event.lg h3 {
    font-size: var(--body-S);
    line-height: var(--body-S-line-height);
  }
}

@media (max-width:1024px) {
  .hgroup {
    padding: 10px 0;
    margin-bottom: 0;
  } 
  .event-lists{padding-bottom: 25px;}
}

@media (max-width:800px) {
  .event-lists.grid{
    --bs-gutter-y: 1.5rem;
    --bs-gutter-x: 0.9rem;
  }
  .event-lists.grid .col{
    width:33.33%;
  }
  .event-lists.grid .card-event .photo{height: auto;}
}

@media (max-width:690px) {
  .col-xs-6{
    flex: 0 0 auto;
    width:50%;
  }
}
@media (max-width:576px) {
  .hgroup{ 
    padding: 6px 0;
    margin-bottom: 0; 
  }
  .seemore .text{
    display: none;
  }

  .scrollbar-group.event{
    margin-left: -15px;
    margin-right: -15px; 
    margin-bottom: 0;
  }
  .scrollbar-group.event .scrollbar-inner{
    padding-left: 15px;
  }  

  /* .event-lists{padding-bottom: 5px;} */

  .event-lists.grid{
    --bs-gutter-y: 0.9rem;
    --bs-gutter-x: 0.9rem;
  }
  .event-lists.grid .col{width: 50%;}

  .event-lists.grid .card-event{
    background-color: transparent;
  }
  .event-lists.grid .card-event .card-body{
    padding-left: 0;
    padding-right: 0;
    flex: unset;
    padding-bottom: 0;
  }
  .event-lists.grid .card-event .card-footer{
    border-top: 0;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
    padding: 8px 0;
  }
  .event-lists.grid .card-event h3{
    margin-bottom: 0;
  }
  .event-lists.grid .card-event .card-footer .icons{background-size: contain;}

  .card-event .card-button{
    padding-left: 0;
    padding-right: 0;
    padding-top: 10px;
  }
  .card-event .card-button + .card-body{padding-top:5px;}
    
}
@media (max-width:414px) {
  
  .col-xs-6{ 
    width:100%;
  }
}

/*==================================================
   Inter Trade Show
==================================================*/  
.section.interTradeShow .background{
  opacity: 0.05;
  background-position: left top; 
}
.section.interTradeShow {padding-bottom: 80px;}

@media (max-width:1199px) {
  .section.interTradeShow {padding-bottom: 45px;}
}

@media (max-width:576px) {
  .section.interTradeShow {padding-bottom: 20px;}
}

/*==================================================
   reserving Booth
==================================================*/  
.section.reservingBooth{
  height: 480px;
  padding: 0 !important;
  background-color: var(--primary-color);
}

.section.reservingBooth .background.lg{display: none;}
.section.reservingBooth .row{
  height: 100%;
}
.section.reservingBooth .row > div{
  position: relative;
}
.section.reservingBooth .background{
  background-position: top center;
}
.section.reservingBooth .logo{
  position: absolute;
  top: 40px;
  left: 40px;
  width: 120px;
  z-index: 100;
}
.section.reservingBooth .article{
  background-color: var(--primary-color);
  color: #fff;
  padding:60px;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.section.reservingBooth .article h2{
  font-weight: 400;
  margin-bottom: 25px; 
}
.section.reservingBooth .article .btn{
  width: 130px;
}
.section.reservingBooth .article p{
  max-width: 455px;
}

@media (max-width:1550px) {
  .section.reservingBooth .background.xl{display: none;}
  .section.reservingBooth .background.lg{display: block;}
}

@media (max-width:1366px) {
  .section.reservingBooth{
    height:440px;
  }
}

@media (max-width:1280px) {
  .section.reservingBooth{
    height: 400px;
  }
} 

@media (max-width:1199px) {
  .section.reservingBooth .background.lg{background-size: 110%;}
} 
@media (max-width:1024px) {
  .section.reservingBooth .background.lg{background-size: 120%;}
} 

@media (max-width:991.98px) {
  .section.reservingBooth{height: 340px;}
  .section.reservingBooth .logo { 
    top: 30px;
    left: 30px;
    width: 70px;
  }

  .section.reservingBooth .article{
    padding:40px; 
  }

  .section.reservingBooth .background.lg{background-size:cover;}
  
}
@media (max-width:855px) {
  .section.reservingBooth{height: auto;}
  .section.reservingBooth .article .btn{
    margin-top: 10px;
  }

  .section.reservingBooth .article h2{
    font-size: var(--h3);
    line-height: var(--H3-line-height);
    margin-bottom: 10px;
  }
  .section.reservingBooth .article{
    padding: 30px; 
    font-size: var(--body-S);
  }
}
@media (max-width:670px) {
  .section.reservingBooth{
    height: auto;
  }

  .section.reservingBooth .background{
    position: relative;
    height:65vw;
  }
  .section.reservingBooth .logo { 
    top: 15px;
    left: 15px;
    width: 60px;
  }

  .section.reservingBooth .article{
    padding: 30px 30px; 
  }
  .section.reservingBooth .article  p{
    max-width: 100%;
  }
  .section.reservingBooth .article .btn{
    margin-top: 10px;
    width: 100%;
  }
}

@media (max-width:576px){
  .section.reservingBooth .article h2 {
    font-size: var(--h2);
    line-height: var(--H2-line-height); 
  }
  .section.reservingBooth .article{
    font-size: var(--body-M);
    padding: 35px 15px 30px;
  }
  .section.reservingBooth .article .btn{
    margin-top: 15px;
  }

  .mt-xs-minus-20{margin-top: -20px;}
  .mt-xs-minus-15{margin-top: -15px;}
 
}

/*==================================================
   Interested
==================================================*/ 
.section.interested{
  background-color: var(--primary-color);
  color: #fff;
  padding-bottom: 105px;
  padding-top: 0;
}
.section.interested .hgroup{
  padding: 60px 0;
  text-align: center;
  border: 0;
  margin: 0;
}

.menu-lists > div{
  border-left: 1px solid rgba(255, 255, 255, 0.25);
  margin-top: 5px;
}

.card-menu{
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 5px 0;
  gap: 25px;
  position: relative;
  top: 0;
  
  transition: all 0.3s;
}
.card-menu .card-icon{
  width: 56px;
  height: 56px;
  margin: 0 auto;
  transition: all 0.3s;
}
.card-menu .card-icon svg{
  vertical-align: top;
  width: 100%;
  height: auto;
}
.card-menu h4{
  font-size:var(--body-L);
  line-height: var(--body-L-line-height);
  font-weight: 500;
  text-align: center;
  margin: 0 auto;
}
.pc .menu-lists > div:hover .card-menu{top: -8px;}
.pc .menu-lists > div:hover .card-menu h4{color: rgba(255, 255, 255, 0.6);}
.pc .menu-lists > div:hover .card-menu .card-icon{transform: scale(1.2);}

@media (max-width:1199px) {
  .card-menu h4{
    padding: 0 15px;
  }
}

@media (max-width:991.98px) {
  .section.interested{
    padding-bottom: 80px;
  }
  .section.interested .hgroup{
    padding-bottom: 20px;
  }
  .menu-lists > div{
    border: 0;
    padding: 30px 0;
  }
}

@media (max-width:670px) {
  .section.interested{
    padding-bottom:40px;
  }
  .section.interested .hgroup{
    padding-bottom: 10px;
    padding-top: 40px;
  }
}


/*==================================================
   venues in Thailand
==================================================*/  

.section.venues-th{
  padding: 60px 0;
}
.card-venues{
  display: flex;
  position: relative;
  width: 100%;
  height: 140px;
}
.card-venues .card-body{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 30px;
  align-items: center;
  display: flex; 
  z-index: 20;
}
.card-venues .card-body:before{
  content: '';
  position: absolute;
  right: 20px;
  width: 14px;
  height: 14px;
  top: 50%;
  margin-top: -7px;
  background-image: url(/img/icons/icon-arrow-line-right.svg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain; 
}
 
.card-venues .card-photo,
.card-venues .card-photo .photo{
  height: 100%;
  width: 100%;
  background-color: #ccc;
} 

.card-venues .card-photo:before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #0C56AD;
  opacity: 0.5;
  z-index: 10;
  transition: all 0.3s;
}
.card-venues.bitec .card-photo:before{background-color: #AD122A;}
.card-venues.qsncc .card-photo:before{background-color: #807724;}
.pc .card-venues:hover .card-photo:before{opacity: 0.2;}


.card-venues .logo{
  width:60px;
  height: 60px;
  border:1px solid var(--light-blue-10);
  flex-shrink: 0;
  margin-right: 20px;
}
.card-venues .logo img{
  width: 100%;
}
.card-venues h4{
  font-size: var(--body-XL);
  line-height: var(--body-XL-line-height);
  font-weight: 500;
  color: #fff;
  line-height:1.2;
}


@media (min-width:1300px) {
  .row{
    --bs-gutter-x: 30px; 
  }
  .row.g-4,
  .row.g-sm-4{
    --bs-gutter-x: 30px; 
    --bs-gutter-y: 30px; 
  }
}

@media (max-width:576px) {
  .section.venues-th{
    padding: 25px 0 20px;
  }

  .card-venues .logo{
    width: 53px;
    height: 53px;
  }
}

/*==================================================
  venue infos
==================================================*/  
.modal.modal-venue .modal-dialog{
  max-width: 1000px;
}
.modal.modal-venue .modal-content{
  background-color: #fff!important;
  padding:45px 90px;
  border-radius: 0;
}

.venue-info-box{
  display: flex;
  gap: 30px;
}
.venue-info-box .logo{
  width: 128px;
  height: auto; 
  flex-shrink: 0;
}
 
.venue-info-box h4{ 
  font-size: var(--body-XL);
  line-height: var(--body-XL-line-height);
  font-weight: 500;
  margin-bottom: 8px;
}

.venue-info-box h5{ 
  font-size: var(--body-M);
  line-height: var(--body-M-line-height);
  font-weight: 500;
  margin-bottom: 15px;
}

.venue-info-box hr{
  border-color: var(--gray-25);
  margin: 30px 0;
  opacity: 1;
}

.contact-item{
  display: flex;
  font-size: var(--body-S);
  line-height: var(--body-S-line-height);
  font-weight: 300; 
}
.contact-item .icons{
  width:14px;
  height: 14px;
  flex-shrink: 0;
  margin-right: 12px;
  margin-top: 7px;
}

.contact-item .icons img{
  width: 100%;
  height: auto;
  vertical-align: top;
}
.contact-item .icons svg path{ fill: var(--black);}

.contact-item a{color: var(--black);}
.contact-item a:hover{opacity: 0.75;}

.contact-item.fb{
  white-space: nowrap;
  margin-top: auto;
}

.contact-lists{
  display: flex;
  justify-content: space-between;
}
.contact-lists > .cols{
  display: flex;
  flex-direction: column;
  gap: 15px;
}

@media (max-width:1440px) {
  .modal.modal-venue .modal-content{ 
    padding:40px 90px;
  }
}

@media (max-width:1199px) {
  .modal.modal-venue .modal-content{ 
    padding:40px 70px;
    margin-left: 20px;
    margin-right: 20px;
  }
}

@media (max-width:991.98px) {
  .modal.modal-venue .modal-content{ 
    padding:40px 40px; 
    margin-top: 20px;
  }
  
}

@media (max-width:750px) {
  .contact-lists{
    flex-direction: column;
    gap: 15px;
  }
}
@media (max-width:670px) {
  .venue-info-box{
    flex-direction: column;
    gap: 20px;
  }
  .modal.modal-venue .modal-content{
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 45px;
    margin-bottom: 45px;
    padding: 30px  20px 30px;
  }

  .venue-info-box hr{
    margin: 25px 0;
  }

  .contact-lists,
  .contact-lists > .cols{
    gap: 10px;
  }
  .contact-lists > .cols:nth-child(2){
    margin-bottom: 5px;
  }
}

/*==================================================
   Blog details
==================================================*/  

.blog-details{
  display: block;
  background-color: #fff;
  
}

.blog-details.policy{
  font-size: var(--body-S);
  line-height: var(--body-S-line-height);
  margin-bottom:60px;
  padding: 50px;
}



.blog-details.policy hr{
  border-color: var(--gray-15);
  margin: 40px 0 30px;
}

.blog-details.policy ul,
.blog-details.policy ol{ 
  margin-bottom: 15px;
  padding-top: 0;
} 

/* .blog-details.policy p + ul,
.blog-details.policy p + ol{margin-top: -5px; } */
.blog-details.policy h4 {
  margin-bottom:10px;
  padding-top: 15px;
  font-weight: 500;
  color: var(--black);
}
.blog-details.policy h4{
  font-size: var(--body-M);
  line-height: var(--body-M-line-height);
}
 
.blog-details.policy h5{
  margin-bottom:10px;
  padding-top: 15px; 
}
 
.blog-details.policy h6{
  margin-bottom:10px;
  padding-top: 15px; 
  font-size: inherit;
}
.blog-details.policy ul,
.blog-details.policy ol{
  padding-left: 17px;
}
.blog-details.policy ul li,
.blog-details.policy ol li{
  margin: 15px 0;
}
.blog-details.policy ul ul{
  padding-top: 10px;
  padding-bottom: 10px;
  margin-bottom: 0;
}
.blog-details.policy a:hover{
  text-decoration: underline; 
  opacity: 1;
  color: var(--primary-color);
}
@media (max-width:991.98px) {
  .blog-details.policy{
    margin-bottom: 40px;
    padding-left: 30px;
    padding-right: 30px;
  }

  .blog-details.policy .title-icons{
    font-size: var(--body-L);
    line-height: 1.3;
  }
  .blog-details.policy .title-icons .icons.top{ 
    margin-top: 6px;
    margin-bottom: auto;
  }
}

@media (max-width:576px) {
  .blog-details.policy {
    margin: -15px -15px 0;
    padding:20px 15px;
  }
  
  .blog-details.policy{
    margin-bottom: 0;
  }

  .blog-details.policy hr{
    margin: 20px 0 15px;
  }
  
  .blog-details.policy h4{ 
    margin-bottom: 5px;
    padding-top: 5px;
  }
}

/*==================================================
   navbar - search
==================================================*/  

.section-search{
  background-color: var(--light-blue-10);
  padding-top: 0 !important;
  z-index: 100;
}
.section-search.py-5{
  padding-top: 3rem!important;
  padding-bottom: 3rem!important;
}
.search-advance-box.in-content .hgroup{
  border: 0;
  margin: 0;
  padding:40px 0 15px;
}
@media (max-width:1300px) {
  .section-search.py-5{
    padding-top: 2rem!important;
    padding-bottom: 2rem!important;
  }
}

@media (max-width:991.98px) {
  .section-search{
    padding-bottom:45px;
  }
  .search-advance-box.in-content .hgroup{
    padding:30px 0  5px;
  }

  .section-search.py-5{
    padding-top:1.5rem!important;
    padding-bottom: 1.5rem!important;
  }
}

@media (max-width:670px) {
  /* .search-advance-box .hgroup{
    padding:30px 0 5px;
  } */
  .search-advance-box.in-content .hgroup{
    padding-top: 25px;
  }
  .search-advance-box.in-content a[data-bs-toggle],
  .input-search-group .dropdown.select a[data-bs-toggle]{
    margin-top: 0;
  }
  .search-advance-box.in-content a[data-bs-toggle]:after,
  .search-advance-box.in-content a[data-bs-toggle="collapse"] .text{display: none;}
  .search-advance-box.in-content a[data-bs-toggle] .icons{
    width: 40px;
    height: 40px; 
    background-size: 20px;
  }

  .section-search.py-5{
    padding-top:1.1rem!important;
    padding-bottom: 1.1rem!important;
  }
}
@media (max-width:576px) {
  .section-search{
    padding-bottom:20px;
  }
  .search-advance-box.in-content .hgroup{
    padding-top: 16px;
    padding-bottom: 5px;
  }
}

/*==================================================
    Thai_trade_show-Lists 
==================================================*/  

.nav-filter-buttons{
  gap: 10px;
  padding: 40px 0;
  flex-wrap: nowrap;
  overflow: hidden;
  position: relative;
}
.nav-filter-buttons li a{
  display: block;
  height: 40px;
  line-height: 38px;
  border-radius: 50px;
  padding: 0 20px;
  color: #fff;
  border:1px solid var(--highlight-color-1);
  background-color: var(--highlight-color-1);
  font-weight: 500;
  font-size: var(--body-S);
  white-space: nowrap;
}
.nav-filter-buttons li a:hover,
.nav-filter-buttons li a.active{
  color: var(--black);
  border:1px solid var(--black);
  background-color: transparent !important;
}

@media (max-width:670px) {
  .scrollbar-wrapper.filter{
    position: relative;
    overflow: hidden;
    padding: 0 0;
    margin: 0 -30px;
  }
  .scrollbar-wrapper.filter .nav-filter-buttons{
    padding: 20px 30px 30px;
    margin-bottom: -10px; 
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  .nav-filter-buttons{
    padding: 20px 0;
  }
}

@media (max-width:576px) {
  
  .scrollbar-wrapper.filter{margin: 0 -15px;}
  .scrollbar-wrapper.filter .nav-filter-buttons{padding-left: 15px;padding-right: 15px;}
  /* .nav-filter-buttons li a{padding: 0 10px;} */
  .btn.viewmore{margin-top: -5px;}
}

/*==================================================
   Blog Details
==================================================*/  
.section-column{
  --sidebar-width:328px;
}
.section-column .container{
  display: flex; 
  flex-direction: row-reverse;
}
.section-column .content{
  width: calc(100% - var(--sidebar-width));
  padding-right: 70px;
}
.section-column .sidebar{
  width: var(--sidebar-width); 
  position: relative;
}

.section-column .blog-details{
  background-color: transparent !important;
}

.blog-details .card-photo{
  background-color: var(--light-blue-10);
}
.blog-details .card-photo .photo{
  background-size: contain;
}

.blog-details .blog-body{
  padding: 45px;
  background-color: #fff;
  position: relative;
}

.blog-details .blog-body.mt-40{
  margin-top: 40px;
}

.blog-details .blog-body.py-30{
  padding-top: 30px;
  padding-bottom: 30px;
}
.blog-details .article h1{
  margin-top: -20px;
  font-size: var(--h2);
  line-height: var(--H2-line-height);
}

.blog-details .article a{
  overflow-wrap: break-word;
  word-wrap: break-word;

  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: break-all;
  /* Instead use this non-standard one: */
  word-break: break-word;

  /* Adds a hyphen where the word breaks, if supported (No Blink) */
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
}

.blog-details .article p{
  /* margin-bottom: 25px; */
  margin-bottom: 0 !important;
}
.blog-details .article p:empty{display: none;}
.blog-details .article ul{
  padding-left:15px;
  /* margin-bottom: 25px; */
  margin-bottom: 0;
}
.blog-details .article ul li{
  position: relative;
  padding-left: 15px;
  list-style-type: none;
}
.blog-details .article ul li:before{
  content:'';
  position: absolute;
  top: 11px;
  left: 0;
  width: 4px;
  height: 4px;
  background-color: var(--black);
  border-radius: 50%;
}
.blog-details .article img{
  max-width: 100%;
}
.blog-details .article iframe.ql-video{
  width: 100%;
  height: 19.7vw;
}
.blog-details .hgroup{ 
  align-items: center;
  margin:10px 0 25px;
  padding:20px 0;
}
.article + .info-item{ margin-top: 15px;}
.info-item{
  display: flex;
  gap: 8px;
  color:var(--gray-50);
  font-size: var(--body-S);
  align-items: center;
}
.info-item .icons{
  width: 14px;
  height: 14px;
  
}
.info-item .icon-eye{
  background-image: url(/img/icons/icon-eye.svg);
}
.info-item .icon-clock{
  background-image: url(/img/icons/icon-clock.svg);
}
.info-item .icon-link{
  background-image: url(/img/icons/icon-link-black.svg);
}
.info-item.related{
  font-size: var(--body-XS);
  line-height: var(--body-XS-line-height);
  font-weight: 500;
  color: var(--black);
  margin: 10px 0 12px;
}
.share-item{
  display: flex;
  gap: 8px;
  color:var(--gray-50);
  font-size: var(--body-M);
  font-weight: 500;
  align-items: center;
  color: var(--black);
  cursor: pointer;
}
.share-item .icons{
  width: 14px;
  height: 14px;
  display: flex;
}
.share-item .icons svg{
  width: 100%;
  height: auto;
  vertical-align: top;
}
.share-item:hover .icons svg circle{
  fill: var(--highlight-color-1);
}
.share-item:hover .icons svg path{
  stroke: var(--highlight-color-1);
}

.blog-details .banner-in-content{
  margin-top:35px;
}

.card-infos{
  border-radius: 3px;
  background-color: var(--light-blue-5);
  padding:30px 35px 15px;
}
.card-infos h5{
  font-size: var(--body-M);
  line-height: var(--body-M-line-height);
  font-weight: 500;
  color: var(--primary-color);
  margin-bottom: 2px;
}

.card-infos [data-bs-toggle="modal"]{cursor: pointer; transition: all 0.24s;}
.pc .card-infos [data-bs-toggle="modal"]:hover{opacity: 0.8;}

.card-infos .links{
  display: flex;
  flex-direction: column;
}
.card-infos .links a{
  margin-right: auto;
  overflow-wrap: break-word;
  word-wrap: break-word;

  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: break-all;
  /* Instead use this non-standard one: */
  word-break: break-word;
}

@media (max-width:1550px) {
  .blog-details .article iframe.ql-video{
    height:24vw
  }
}
@media (max-width:1300px) {
  .blog-details .article iframe.ql-video{
    height:30vw
  }
}

@media (max-width:1280px) {
  .section-column .content{
    padding-right: 50px;
  }
}
@media (max-width:1100px) {
  /* .section-column{
    --sidebar-width:280px;
  } */
  .section-column .content{
    padding-right:30px;
  }
  .blog-details .blog-body {
    padding:40px 20px 20px;
  }

  
  .blog-details .blog-body.py-30{
    padding-top: 25px;
    padding-bottom: 25px;
  }
}
@media (max-width:991.98px) {
  .blog-details .blog-body.py-30{
    padding-top: 15px;
  }
}

@media (max-width:670px) {
  .section-column .container{
    flex-direction: column;
  }

  .section-column .content,
  .section-column .sidebar{
    width: 100%;
    padding: 0;
  }
 
  .blog-details .hgroup{
    margin: 0 0 16px;
    padding: 17px 0 16px;
  }

  .blog-details .banner-in-content{
    margin-top: 18px;
  }

  .share-item{
    font-size: var(--body-S);
  }
  .card-infos{
    margin-top: 2px;
    padding:15px 20px;
  }
  .card-infos p{
    margin-bottom: 6px;
  }

  .blog-details .blog-body.py-30{padding-bottom: 10px;}

  .blog-details .article h1{
    font-size: var(--M-H3);
    line-height: var(--M-H3-line-height);
  }

  .blog-details .article iframe.ql-video{
    height:55vw
  }
}

/*==================================================
   sidebar
==================================================*/  

.section-column .sidebar:before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right:0;
  height: 8px;
  background: linear-gradient(90deg, #2E3192 0%, #505FAD 100%);
}
.section-column .sidebar.line-0{padding-top: 0;}
.section-column .sidebar.line-0:before{display: none;}
.section-column  .sidebar-inner{
  display: flex;
  flex-direction: column;
  background-color: #fff;
  padding: 20px;
}
.section-column .card-photo.top{
  display: none;
}
.sidebar .button{
  display: block;
  width: 100%;
  border-top: 1px solid var(--gray-15);
  padding: 22px 0;
}
.sidebar .button .icon-pen{ 
  background-image: url(/img/icons/icon-pen.svg); 
}

.btn .icons.left{
  width: 14px;
  height: 14px; 
  position: absolute;
  top: 50%;
  left: 15px;
  margin-top: -7px;
}

.form .btn .icons.left{left: 25px;}
.sidebar .card-infos{
  padding: 20px 20px 5px;
}

.sidebar .banner-in-content{margin-top: 40px;}

.sidebar h3{
  margin-bottom: 20px;
  margin-top: 5px;
}
.blog-info{
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--gray-15);
  padding: 15px 0 20px;
  gap: 10px;
  font-weight: 500;
}
.blog-info h4{
  color: var(--highlight-color-1);
}
.blog-info .d-flex{
  gap: 15px;
  align-items: center;
}
.blog-info .icons{
  width: 38px;
  height: 38px;
  border-radius: 3px;
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  background-color: var(--highlight-color-1-light10);
}
.blog-info .icons svg,
.blog-info .icons img{
  margin: auto;
  vertical-align: top;
  width: 20px;
  height: auto;
}
.blog-info .icons svg path,
.blog-info .icons svg circle{
  stroke: var(--highlight-color-1);
}

.blog-info #textVenue{line-height: 1.3;}

.blog-info .badge{
  background-color: var(--red-light);
  border-radius: 50px;
  height: 40px;
  line-height: 40px;
  padding: 0 20px;
  margin:1px 0 5px;
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  margin-right: auto;
  color: var(--red);
  font-weight: 500;
  font-size: var(--body-S);
}

.blog-info .badge .icon-info{
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  background-image: url(/img/icons/icon-info-red.svg);
}
.blog-details .button-group,
.card-form .button-group{
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 40px;
}
.blog-details .button-group .btn,
.card-form .button-group .btn{
  width: 100%;
}
.btn .icon-pen{background-image:url(/img/icons/icon-pen.svg)}
.btn .icon-pen-2{background-image:url(/img/icons/icon-pen-white.svg)}
.btn .icon-share{background-image:url(/img/icons/icon-share.svg)}
.btn .icon-user{background-image:url(/img/icons/icon-user-white.svg)}
.btn .icon-lock{background-image:url(/img/icons/icon-lock-white.png)}
.pc .btn-outline-black:hover .icon-share{background-image:url(/img/icons/icon-share-white.svg)}

.btn-outline-black .icon-pen{background-image: url(/img/icons/icon-pen-black.svg);}
 .pc .btn-outline-black:hover .icon-pen{background-image: url(/img/icons/icon-pen.svg);}
@media (min-width:671px) and (max-width:991.98px) {
  .section-column{
     --sidebar-width:240px;
   }
   .section-column .sidebar:before{
     height: 6px;
   }
   .section-column .sidebar-inner{
     padding: 15px;
   }
   .sidebar h3{
     font-size: var(--body-XL);
     line-height: var(--body-M-line-height);
   }
   .blog-info {
     padding: 12px 0 15px;
     gap: 5px;
     font-size: var(--body-XS);
     line-height: var(--body-XS-line-height);
   }
   .blog-info h4{
     font-size: var(--body-S);
     line-height: var(--body-S-line-height);
   }
   .blog-info .d-flex{gap: 10px;}
   .blog-info .icons {
    width: 32px;
    height: 32px;
   }
   .blog-info .icons svg,
   .blog-info .icons img{
     width: 16px;
     height: auto;
   }

   .section-column .content{
     padding-right:20px;
   }

   .sidebar .button .btn{
     font-size: var(--body-S);
   }

   .sidebar .card-infos h5,
   .sidebar .card-infos {
    font-size: var(--body-S);
    line-height: var(--body-S-line-height);
   }
  .card-infos p{
     margin-bottom: 8px;
   }
  .card-infos {
    padding: 15px 15px 10px;
  }

  .sidebar .banner-in-content{
    margin-top: 20px;
  }

  .blog-details .blog-body {
    padding:15px;
  }

  .blog-details .article h1{
    margin-top: 0;
    font-size: var(--M-H1); 
    line-height: var(--M-H1-line-height); 
  }

  .blog-details .hgroup{
    padding: 15px 0;
    margin-bottom: 15px;
  }

  .blog-details .article p,
  .blog-details .article ul{
    /* margin-bottom: 20px; */
  }
    
  .blog-details .banner-in-content{
    margin-top: 15px;
  }

  .title-icons-lists{margin-top: 0;}
  .title-icons-lists .title-icons{
    padding: 18px 0px;
  }
  .title-icons-lists .title-icons .text{
    display: none;
  }
}
@media (max-width:1280px){
  .section-column .banner-in-content.bottom{
    margin-bottom: 20px;
    margin-top:60px;
  }
}

@media (max-width:1199px){
  .section-column .banner-in-content.bottom{
    margin-bottom: 20px;
    margin-top:50px;
  }
}

@media (max-width:1199px){
  .section-column .banner-in-content.bottom {
    margin-bottom:5px;
    margin-top:35px;
  }
}

@media (max-width:670px){
  .blog-details .card-photo{display: none;}
  .section-column{padding-top: 15px;}
  .section-column .card-photo.top{
    display: block;
    margin-bottom: 15px;
    background-color: var(--light-blue-10);
  }
  .section-column .card-photo.top .photo{
    background-size: contain;
  }
  .sidebar h3{
    font-size: var(--M-H3);
    line-height: var(--M-H3-line-height);
  }

  .sidebar h3.line-xs{
    margin-bottom: 10px;
    margin-top: 1px;
  }

  .blog-info{
    border: 0;
    padding: 8px 0;
  }
  .blog-info h4{display: none;}

  .sidebar .button{
    border: 0;
    padding: 10px 0 18px;
  }
  .sidebar .banner-in-content {
    margin-top: 20px;
  }

  .section-column .blog-details{
    margin-left: -15px;
    margin-right: -15px;
    margin-top: 20px; 
  }

  .section-column .blog-details h1{display: none;}
  .blog-details .blog-body{padding:0 15px 20px;}

  .blog-details .button-group,
  .card-form .button-group{
    padding: 15px;
    margin: 0;
    gap: 15px;
  }

  .section-column .banner-in-content.bottom{
    margin-top: 0;
    margin-bottom: 0;
  }
  
  .blog-info .badge{ margin-bottom: 5px;margin-top: -10px;}

  .section-column .container.flex-row{
    flex-direction: column !important;
  }
}

/*==================================================
   Share
==================================================*/ 

.social-media-share{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap:35px;
}
.social-media-share a.item{
  width: 40px;
  height: 40px;
}
.social-media-share .d-flex .icons{
  width: 100%;
  height: 100%;
  background-size: 40px;
}
.social-media-share .d-flex{
  gap:35px ;
}
.social-media-share .icon-facebook{background-image: url(/img/icons/icon-facebook-black-2.svg);}
.social-media-share .icon-twitter{background-image: url(/img/icons/icon-twitter-black.svg);}
.social-media-share .icon-line{background-image: url(/img/icons/icon-line-black.svg);}
.social-media-share .icon-in{background-image: url(/img/icons/icon-linkedIN-black.svg);}
.social-media-share .icon-email{background-image: url(/img/icons/icon-email-black-2.svg);}

.social-media-share a:hover .icon-facebook{background-image: url(/img/icons/icon-facebook-colorful.svg);}
.social-media-share a:hover .icon-twitter{background-image: url(/img/icons/icon-twitter-colorful.svg);}
.social-media-share a:hover .icon-line{background-image: url(/img/icons/icon-line-colorful.svg);}
.social-media-share a:hover .icon-in{background-image: url(/img/icons/icon-linkedIN-colorful.svg);}
.social-media-share a:hover .icon-email{background-image: url(/img/icons/icon-share-email-colorful.svg);}

.copylink{
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  font-size:var(--body-S);
  line-height: var(--body-S-line-height);
  color: var(--black);
  font-weight: 300;
  gap:8px;
  cursor: pointer;
}
.copylink .icons{
  width: 14px;
  height: 14px;
  background-image: url(/img/icons/icon-link-black.svg);
} 
.pc .copylink:hover .icons{
  background-image: url(/img/icons/icon-link-orange.svg);
}

.copylink-done{
  position: absolute;
  left: 50%;
  bottom:-10px;
  margin-left: -79px;
  width: 158px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  background-color: #fff;
  font-size: var(--body-S);
  transition: all 0.5s;
  opacity: 0;
}
.copylink-done .icons{
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  margin-right: 8px;
  background-image: url(/img/icons/icon-true.svg);
}

.copylink-done.show{
  opacity: 1;
  bottom: 10px;
}

.share-title{
  display: flex;
  justify-content: center;
  align-items: center;

  position: absolute;
  top: 10px;
  left: 40px;
  right: 40px;
  font-size: var(--body-L);
  line-height: var(--body-L-line-height);
  color: var(--gray-50);
}
.share-title .icons{
  width: 14px;
  height: 14px;
  margin-right: 8px;
}
.share-title .icons svg{
  width: 100%;
  height: auto;
  vertical-align: top;
}
.share-title .icons svg path{
  stroke: var(--gray-50);
}
.share-title .icons svg circle{
  fill: var(--gray-50);
}

@media (max-width:576px) {
  .social-media-share .d-flex{gap: 20px;}

  .share-title{
    font-size: var(--body-M);
    line-height: var(--body-M-line-height);
    top: 20px;
  }
  .share-title .icons{top: 2px;}

  .copylink-done.show{bottom: 20px;}
}

/*==================================================
   Booth Reservation Detail
==================================================*/  

.blog-details.mw-765{
  max-width: 765px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  background-color: transparent;
}

.blog-details .hgroup.top{
  padding-top: 0;
  margin-top: -10px;
}
.texteditor{
  font-size: var(--body-M);
  line-height: var(--body-M-line-height);
  font-weight: 300;
}
.texteditor img,
.texteditor p{
  margin-bottom: 25px;
}

.section-banner.booth-reserve .background{
  background-image: url(/img/thumb/banner-booth-reservation-desktop.jpg);
  position: absolute; 
}

.section-banner.booth-reserve.lists .background{
  background-image: url(/img/thumb/banner-booth-reservation-lists-desktop.jpg);
  position: absolute; 
}
  
.line-animate{ 
  height: 4px;
  position: relative;
}
.line-animate:before{
  content: '';
  position: absolute;
  width: 0;
  height: 100%;
  display: inline-block;
  top: 0;
  background-color: var(--highlight-color-1);
  transition: all 0.8s;
  transition-delay: 0.2s;
} 
.line-animate.center:before{
  left: 50%;
  transform: translateX(-50%);
}
.line-animate.animated:before {width: 100%;}

.booth-reserve .banner-caption{
  position: relative;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  color: #fff;
  min-height: 480px;
  padding: 60px 0;
}
.booth-reserve .banner-caption .container{
  margin-top: auto;
  margin-bottom: auto; 
}
.booth-reserve .banner-caption h1,
.booth-reserve .banner-caption h2,
.booth-reserve .banner-caption p{
  color: inherit;
  text-shadow: 0px 4px 12px rgba(0, 0, 0, 0.05);
}
.booth-reserve .banner-caption h2{
  max-width: 540px;
  line-height: var(--H2-line-height);
}
.booth-reserve .banner-caption .line-animate{
  width: 60px;
  height: 4px;
  margin: 30px 0 25px;
  
  display: block;
  margin-right: auto; 
}
.booth-reserve .banner-caption .line-animate.center{
  margin-left: auto;
  margin-right: auto;
}
 
.booth-reserve .banner-caption .button{
  margin-top: 30px;
}
.booth-reserve .banner-caption .btn{
  padding: 0 45px;
}
.booth-reserve .banner-caption .btn .icons{
  width: 14px;
  height: 14px;
  margin-left: 2px;
}

.booth-reserve.lists .banner-caption{
  min-height: 320px;
}
.booth-reserve.lists .banner-caption .line-animate{
  margin-top: 30px;
  margin-bottom: 30px;
}
.btn-white .icon-pen{background-image: url(/img/icons/icon-pen-orange.svg);}
.pc .btn-white:hover .icon-pen{background-image: url(/img/icons/icon-pen.svg);}

.item-animate{
  display: block;
  overflow: hidden;
  position: relative;
}
.item-animate > span{
  display: block;
}
@media (max-width:1400px) {
  .section-banner.booth-reserve .banner-img{display: none;}
   
}
@media (max-width:1280px) {
  .booth-reserve .banner-caption{
    padding-left: 40px;
  }
}
@media (max-width:1024px) {
  .section-banner.booth-reserve .background{
    background-image: url(/img/thumb/banner-booth-reservation-tablet.jpg);
  }

  .booth-reserve .banner-caption h2{
    max-width: 440px;
  }

  /* .booth-reserve .banner-caption .line-animate{margin:25px 0 20px;}*/

  .booth-reserve .banner-caption .line-animate.animated{width: 50px;} 
}

@media (max-width:991.98px) { 
 
  .booth-reserve .banner-caption{
    padding: 20px 0 20px 30px;
    min-height: 88vw;
  }
  .section-banner.booth-reserve .background{ 
    background-image: url(/img/thumb/banner-booth-reservation-mobile.jpg);
  }
  .booth-reserve .banner-caption h1{margin-top: -15px;}
   
  .booth-reserve.lists .banner-caption .line-animate{
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .booth-reserve.lists .banner-caption{
    padding-left: 80px;
    padding-right: 80px;
    min-height: 65vw;
  }
  .section-banner.booth-reserve.lists .background{
    background-position: right center;
    background-image: url(/img/thumb/banner-booth-reservation-lists-mobile.jpg);
  }

}
@media (max-width:670px) {
  .texteditor img,
  .texteditor p{
    margin-bottom: 20px;
  }
}

.blog-details.reserve .info-item{
  margin: 40px 0 35px;
}
.blog-details.reserve .blog-body .button-group{margin-top:30px;}
.blog-details.reserve .blog-body{padding: 50px;}
.btn .icon-jumpto{background-image: url(/img/icons/icon-jumpto-black.svg);}
.pc .btn:hover .icon-jumpto{background-image: url(/img/icons/icon-jumpto.svg);}

@media (max-width:750px) {
  .blog-details.reserve .blog-body{padding: 30px 30px 40px;}
}

@media (max-width:670px) {
  .blog-details.reserve{
    width: auto;
    max-width: none;
    margin: -20px -15px 0;
  }

  .blog-details.reserve .hgroup.top{display: none;}
  .blog-details.reserve .blog-body {padding: 15px;}
  .blog-details.reserve .info-item {margin: 30px 0 25px;}
  .blog-details.reserve .blog-body .button-group{padding:  0 0; margin-top:15px;}

  .booth-reserve .banner-caption h1{
    font-size:var(--M-H1);
    line-height: var(--M-H1-line-height);
  }
  .booth-reserve .banner-caption h2{
    font-size: var(--M-H2);
    line-height: var(--M-H2-line-height);
  } 
  .section-banner.booth-reserve .background{ 
    background-image: url(/img/thumb/banner-booth-reservation-mobile.jpg);
  }
  .booth-reserve .banner-caption{
    padding: 30px 10px; 
    min-height: 88vw; 
  }
  .booth-reserve .banner-caption h2{
    max-width:300px;
  }

  .booth-reserve .banner-caption .line-animate{margin:20px 0 15px; height: 2px;}

  .booth-reserve .banner-caption .line-animate.animated{width: 40px;} 
  .booth-reserve .banner-caption .button{margin-top: 15px;}
  .booth-reserve .banner-caption .container{margin-top: 20px;}

  .booth-reserve .banner-caption .btn{
    padding-right: 32px;
    padding-left: 35px;
  }
  .booth-reserve .banner-caption .btn .icons{
    margin-left: -3px;
  }

  .booth-reserve.lists .banner-caption{
    padding-left:0;
    padding-right: 0;
    padding-top: 35px;
    min-height: 65vw;
    font-size: var(--body-XS);
    line-height: var(--body-XS-line-height);
  }
  .booth-reserve.lists .banner-caption .line-animate {
    margin-top: 10px;
    margin-bottom: 14px;
  }
  .booth-reserve.lists .banner-caption p{
    max-width: 278px;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/*==================================================
   navbar-event-infos 
==================================================*/ 

.navbar-event-infos{
  background-color: var(--primary-color);
  color: #fff;
  padding: 28px 0;
}
.navbar-event-infos h4{
  color: var(--highlight-color-2);
  font-weight: 500;
  margin-bottom: 10px;
}
.navbar-event-infos .infosgroup{
  display: flex; 
  font-weight: 400;
}
.navbar-event-infos .infosgroup p{
  margin: 5px 0 0;
}
.navbar-event-infos .icons{
  width: 38px;
  height: 38px;
  border-radius: 3px;
  background-color: var(--light-blue-5);
  flex-shrink: 0;
  margin-right: 15px;
  display: flex;
}
.navbar-event-infos .icons svg,
.navbar-event-infos .icons img{
  margin: auto;
  vertical-align: top;
  width: 20px;
  height: auto;
}
.navbar-event-infos .icons svg path{
  stroke: var(--primary-color) !important;
}
.navbar-event-infos .row > div{
 position: relative;
}
.navbar-event-infos .row > div:before{
  content: '';
  position: absolute;
  left: -30px;
  top: 0;
  bottom: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.25)
}
.navbar-event-infos .row > div:first-child:before{
  display: none;
}

@media (min-width:750px) and (max-width:991.98px){
  .navbar-event-infos h4{
    font-size: var(--body-M);
    line-height: var(--body-M-line-height);
  }
  .navbar-event-infos .infosgroup{
    font-size: var(--body-S);
    line-height: var(--body-S-line-height);
  }
  .navbar-event-infos .infosgroup p{
    margin-top: 0px;
  }
  .navbar-event-infos .icons {
    width:28px;
    height: 28px;
    margin-right: 10px;
  }
  .navbar-event-infos .icons svg,
  .navbar-event-infos .icons img{width: 16px;}

  .navbar-event-infos .row > div:before{
    left: -15px;
  }
}

@media  (max-width:749px){
  .blog-details .blog-body.mt-40{
    margin-top: 30px;
  }
}

@media  (max-width:749px){
  .navbar-event-infos{padding: 0 0 10px 0;}
  .navbar-event-infos .row > div{
    width: 100%;
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    padding: 15px 0 18px 0;
  }
  .navbar-event-infos .row > div:before{
    display: none;
  }
  .navbar-event-infos .row > div:first-child{
    border-top: 0;
  }
  .navbar-event-infos h4{margin-bottom: 15px;}
}

@media  (max-width: 670px){
  .navbar-event-infos{padding: 2px 0 5px 0;}
  .navbar-event-infos .row > div{
    padding: 10px 0 15px;
  }
  .navbar-event-infos h4{margin-bottom: 12px;}

  .blog-details .blog-body.form-register{
    margin-top: 15px;
    margin-left: 15px;
    margin-right: 15px;
    padding: 20px;
  }

  
}

/*==================================================
   Form Register 
==================================================*/ 

.form-note{
  font-size: var(--body-S);
  line-height: var(--body-S-line-height);
  color: var(--gray-25);
}
.form-register .form-note{
  margin: 0;
  padding:7px 0;
}


.form-action .form-group{
  display: block;
  background-color: transparent;
  
  padding:10px 0 0;
  margin: 0 0 25px 0;
  width: 100%;
  vertical-align: top; 
  border-radius: 0;
  position: relative;

  -webkit-transition: all 0.20s ease-in-out;
  -moz-transition: all 0.20s ease-in-out;
  -ms-transition: all 0.20s ease-in-out;
  -o-transition: all 0.20s ease-in-out;
}

.form-action .form-control{
  padding: 0;
  margin: 0;
  border:0;
  background-color: transparent !important;
  border-bottom:1px solid var(--gray-15);
  padding-top:5px;
  height:48px;
  line-height: 48px;
  line-height: normal;  
  color: var(--black); 
  box-shadow: none !important;
  display: block;
  
}
.form-action .form-control[disabled]{color: var(--gray-50);}
.form-action .input-focus .form-control{
  border-bottom:1px solid var(--gray-15);
}
.select.dropdown .form-control{
  pointer-events: all;
}
.form-action textarea.form-control{
  height: 130px;
  line-height: normal;
}

.form-action label.title{
  position: absolute;
  top: 19px;
  left: 0;
  z-index: 9;

  padding: 0;   
  font-size: var(--body-M);
  line-height: var(--body-M-line-height);  
  color: var(--gray-50);
  font-weight: 300;

  transition: 0.2s ease all;

  -moz-user-select: none;
  pointer-events: none;
  white-space: nowrap;
  pointer-events: none;
}
.form-action .form-group:before{
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  border-bottom: 1px solid var(--light-blue);
  transition: all 0.45s;
}
.form-action .form-group.input-focus:before{
  width: 100%;
}

.form-action .error-label{
  color:var(--red);
  font-size: var(--body-3);
  font-weight: 300;

  position: absolute;
  bottom: 10px;
  right: 0;
  z-index: 9;

  pointer-events: none;
  opacity: 0; 
}

.form-action div.has-value label.title,
.form-action input.selected ~ label.title{
  top:-3px;  
  font-size: var(--body-XS);
  line-height: var(--body-XL-line-height);

} 
.form-action div.field-error .error-label{ opacity: 1} 

.form-action span.error,
.form-action span.text-error{
  font-size: var(--body-S);
  line-height: var(--body-S-line-height);
  color:var(--red);
  position: absolute;
  bottom:-30px;
  left: 0;
  padding-left: 20px;
}

.form-action span.error:before{
  content: '';
  position: absolute;
  top: 10px;
  left: 0;
  width: 14px;
  height: 14px;
  background-image: url(/img/icons/icon-info-red.svg);
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
}

.form-action input.selected ~ span.error{
  display: none;
}
.form-action .select.dropdown{
  position: static;
}
  
 
.form-action .select.dropdown:before{
  content: '';
  position: absolute;
  top: 50%;
  right:5px;
  width:10px;
  height: 10px;
  margin-top:1px;

   
  transform: rotate(-135deg);  

  border-top: 1px solid var(--black);
  border-left: 1px solid var(--black);

  transition: all 0.2s ease-in-out;

}

.form-action .select.dropdown.input-focus:before{
  transform: rotate(-315deg);  
} 
.blog-details.reserve.completed{
  padding-bottom: 60px;
}
.blog-details.reserve.completed .title-icons{
  justify-content: center;
  margin-top: -10px;
}
 
.captcha-box{
  display: block;
  width: 100%;
  max-width: 303px;
  margin: 15px 0 40px;
  position: relative;
}
.form-action .captcha-box .text-error{
  padding-left: 0 !important;
  position: relative !important;
  bottom: auto;
  top: auto !important;
  display: none;
}
.form-completed{
  background-color: var(--light-blue-5);
  padding:40px;
  text-align: center;
  margin-top: 40px;
}

.form-completed h5{
  font-size: var(--body-L);
  line-height: var(--body-L-line-height);
  color: var(--green);
  margin-bottom: 15px;
}

.form-completed .icon-60{
  width: 60px;
  margin: 20px auto 40px;
}

.form-register .btn.submit.invalid{
  background-color:var(--highlight-color-1-light50);
  border-color: var(--highlight-color-1-light50);
  pointer-events: none;
}

.fancybox-button--close{
  width: 38px;
  height: 38px;
  top: 35px;
  right: 35px;
  background-image: url(/img/icons/icon-modal-close.svg);
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  transition: all 0.25s;
}
.pc .fancybox-button--close:hover{
  background-image: url(/img/icons/icon-modal-close-orange.svg);
}
.fancybox-button--close svg{
  display: none;
}

.fancybox-slide--image {
  overflow: hidden;
  padding:65px 40px!important; 
}

.placeholder{
  background-color: transparent;
  position: absolute;
  left: auto;
  bottom: auto;
  color:var(--gray-50);
  opacity: 1;
  cursor: text;
  pointer-events: none;
  transition: none;
  bottom: 0px;
  left: 0;
  width: 100%;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.has-value .placeholder{opacity: 0;}

.dropdown  .placeholder{bottom: -2px;}

.input-search-group .dropdown.select [data-bs-toggle] .text{
  height:23px;
  display: block;
}
.dropdown.select a[data-bs-toggle] + .placeholder{bottom:  -4px;}
@media  (max-width: 991.98px){
  .fancybox-slide--image {
    padding:55px 30px!important; 
  }
}

@media  (max-width: 750px){
  .blog-details.reserve.completed .title-icons{
    margin-top: 5px;
  }
  .blog-details.reserve.completed .blog-body{padding-bottom: 30px;}
  .blog-details.reserve.completed .button-group{
    margin-top: 30px;
  }
  /* .form-completed .icon-60 { 
    margin: 10px auto 30px;
  } */
  
}

@media  (max-width: 670px){
  .form-register .form-note{
    padding: 0px 0 10px;
    margin-top:-4px;
  }

  .form-action span.error, .form-action span.text-error{
    font-size: var(--body-XS);
    line-height: var(--body-XS-line-height);
    bottom: -25px;
  }
  .form-action span.error:before{
    width: 12px;
    height: 12px;
    top: 6px;
  }

  .captcha-box{margin: 10px 0 30px;}

  .form-register .form-note  + .button-group{margin-top:10px !important;}

  .blog-details.reserve.completed{
    margin: 0;
  }
  .blog-details.reserve.completed .blog-body{padding: 20px;}
  .blog-details.reserve.completed .title-icons{
    margin-top: 0;
    margin-bottom: 0;
  }
  .form-completed{
    margin-top: 20px;
    padding: 20px 20px 25px;
  }
  .form-completed .icon-60 { 
    margin: 10px auto 20px;
  }
  .blog-details.reserve.completed{padding-bottom: 20px;}
  .blog-details.reserve.completed .button-group{
    margin-top:20px;
    padding: 0;
  }

  .fancybox-button--close{
    width: 24px;
    height: 24px;
    top: 15px;
    right: 15px;
  }

  .fancybox-slide--image {
    padding:45px 20px!important; 
  }
}

/*==================================================
   Gallery 
==================================================*/ 
.gallery-grid {
  /* display: flex;
  flex-wrap: wrap; */
  position: relative;   
  margin: -10px -15px 0;
}
.gallery-grid > .grid-item {
  width:50%; 
  padding: 15px; 
  /* opacity: 0; */
  /* transition: all 0.4s ease-in-out; */
}
.gallery-grid a[data-fancybox] {
  display: block;
  position: relative;
  overflow: hidden;
}
.gallery-grid a[data-fancybox]:before{
  content:'';
  position: absolute;
  top: 0;
  left: 0;
  right: 0; 
  height: 100%;
  transition: all 0.35s;
  background-color: rgba(44, 44, 50, 0.3);
  
  opacity: 0;
}
.gallery-grid a[data-fancybox]:after{
  content:'';
  position: absolute;
  top: 20px;
  left: 0;
  right: 0; 
  height: 100%;
  transition: all 0.35s;
  opacity: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url(/img/icons/icon-gallery-search.svg);
  background-size: 40px;
}
.pc .gallery-grid a:hover[data-fancybox]:before{opacity: 1;}
.pc .gallery-grid a:hover[data-fancybox]:after{opacity: 1; top:0}

.fancybox-bg{background-color: var(--light-blue-10);}
.fancybox-toolbar{top: 0; right: 0; }
.fancybox-infobar{
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  bottom: 10px;
  top: auto;
  color: var(--black);
  font-size: var(--body-S);
  opacity: 1 !important;
  z-index: 1000;
  mix-blend-mode: unset;
}
.fancybox-navigation .fancybox-button{ }
.fancybox-navigation .fancybox-button--arrow_left,
.fancybox-navigation .fancybox-button--arrow_right{
  width: 38px;
  height: 38px;
  padding: 0;
  top: calc(50% - 19px);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url(/img/icons/icon-banner-arrow-grey.svg);
  transition: all 0.25s !important;
}
.fancybox-navigation .fancybox-button--arrow_left{left: 35px; transform: rotate(-180deg);}
.fancybox-navigation .fancybox-button--arrow_right{right: 35px;}
.pc .fancybox-navigation .fancybox-button--arrow_left:hover,
.pc .fancybox-navigation .fancybox-button--arrow_right:hover{background-image: url(/img/icons/icon-banner-arrow-orange.svg);}
.blog-details.details .banner-in-content{
  margin-top: 30px;
  margin-bottom:30px;
}
.blog-details.details .button-group{
  margin-top: 60px;
}

.blog-details.details .button-viewmore{
  margin: 45px 0;
}
@media  (max-width: 1100px){
  .gallery-grid{
    margin-top: -9px;
    margin-left: -9px;
    margin-right: -9px;
  }
  .gallery-grid > .grid-item{
    padding: 10px;
  }

  .blog-details.details .button-group{margin-top: 50px;}

  .fancybox-navigation .fancybox-button{display: none;}
}

@media  (max-width: 991.98px){
  .gallery-grid{
    margin-top: 0px;
    margin-left: -6px;
    margin-right: -6px;
  }
  .gallery-grid > .grid-item{
    padding: 7px;
  }

  .blog-details.details .button-viewmore{
    margin: 25px 0 25px;
  }
  .blog-details.details .button-viewmore .btn{margin-top: 0;}
  .blog-details.details .button-group{
    margin-top: 35px;
  }
  .blog-details.details .banner-in-content {
    margin-top: 10px;
    margin-bottom: 10px;
  }
}

@media  (max-width:670px){
  .fancybox-navigation .fancybox-button--arrow_left,
  .fancybox-navigation .fancybox-button--arrow_right{
    width:24px;
    height:24px;
  }
  .fancybox-navigation .fancybox-button--arrow_left{left: 15px;}
  .fancybox-navigation .fancybox-button--arrow_right{right: 15px;}
}
@media  (max-width:576px){
  .blog-details.details .button-viewmore{
    margin:10px 0 20px;
  }
  .blog-details.details .button-group{
    margin-top:5px;
    margin-bottom: 5px;
  }
  .section-column .blog-details.details{margin-top: -15px;}
}

/*==================================================
   Page Mobile Menu 
==================================================*/

.page-menu{
  
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color:#d8def1;
  mix-blend-mode: multiply;
  background-image: url(/img/thumb/bg-register-mobile.jpg);
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size:contain;
  display: flex;

  padding-bottom: 200px;
}
.page-menu:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #2E3192 50%, #6E87C4 100%);
}

.page-menu.bg-none{
  background-color: var(--light-blue-10);
  background-image: none;
}

.page-menu .navbar-brand.middle{
  width: 220px;
  margin: auto;
}

.page-menu .footer-buttons{
  position: absolute;
  left: 40px;
  right: 40px;
  bottom: 40px;
  display: flex;
  gap: 20px;
  flex-direction: column;
}
.page-menu .footer-buttons .btn{
  width: 100%;
}

.member-infos{
  display: flex;
  flex-direction: column;
  padding: 20px 40px;
  width: 100%;
}
.member-infos .avatar{
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background-color: var(--light-blue);
  position: relative;
  flex-shrink: 0;
}
.member-infos .avatar:before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 50%;
  background-image: url(/img/icons/icon-user-white-2.svg);
}
.member-infos .member-level{
  width: 24px;
  height: 24px;
  background-image: url(/img/icons/icon-member-levels-orange.svg);
  position: absolute;
  bottom: 0;
  right: -5px;
  z-index: 10;
}
.member-infos .member-type{
  height: 32px;
  line-height: 28px;
  border:1px solid var(--gray-15);
  border-radius: 30px;
  padding: 0 15px;
  text-align: center;
  font-size: var(--body-XS); 
  color: var(--gray-50);

  background-color: #fff;
  margin-right: auto;
}
.member-infos .member-type strong{
  color: var(--light-blue);
  font-weight: 500;
  font-size: var(--body-S);
}
.member-infos h4{
  margin: 13px 0;
}

.nav-member{
  flex-direction: column;
}
.nav-member li a{
  display: flex;
  gap: 10px;
  font-size: var(--body-M); 
  padding:8px 0;
  font-weight: 500;
  align-items: center;
}
.nav-member li a .icons{
  width: 14px;
  height: 14px;
}
.nav-member .icon-user {background-image: url(/img/icons/icon-user.svg);}
.nav-member .icon-lock {background-image: url(/img/icons/icon-lock.svg);}
.nav-member .icon-logout {background-image: url(/img/icons/icon-logout.svg);}

.nav-member li a .icons svg{
  width: 100%;
  height: auto;
  margin-bottom: auto;
  vertical-align: top;
}
.pc .nav-member li:hover a{color: var(--highlight-color-1)}
.pc .nav-member li:hover a .icons svg path,
.nav-member li.active a .icons svg path{stroke: var(--highlight-color-1);}

.pc .nav-member li:hover a .icons svg.lock path,
.nav-member li.active a .icons svg.lock path{fill: var(--highlight-color-1);}

.page-menu .member-infos{padding: 20px 20px;}
.page-menu .member-infos hr{margin: 35px 0 20px;}

@media  (min-width:700px){
  .page-menu .member-infos{padding: 20px 40px;}
  .page-menu .member-infos .member-type{
    height: 40px;
    line-height: 38px;
   
    padding-left: 20px;
    padding-right: 20px;
  }
  .page-menu .member-infos hr{
    margin: 50px 0 30px;
  }
  .page-menu .member-infos h4{
    margin:18px 0px;
  }
  
  .page-menu .nav-member li a{
    padding:10px 0;
    gap: 12px;
  }
}


@media  (max-width:750px){
  .page-menu .navbar-brand.middle{
    width: 200px;
  }
}

@media  (max-width:576px){
  .page-menu .navbar-brand.middle{
    width: 180px;
  }

  .page-menu .footer-buttons{
    left: 20px;
    right: 20px;
    bottom: 30px;
    gap: 20px;
  }
}


@media  (max-width:375px){
  .page-menu .footer-buttons{
    gap: 15px;
  }
  .page-menu .navbar-brand.middle{
    width: 160px;
  }

}
/*==================================================
   Footer 
==================================================*/ 
.footer{
  background-color: var(--primary-color);
  color: #fff;
  position: relative;
}
.footer:before{
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-position: top left;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url(/img/thumb/footer-bg-desktop.png);
}
.totop-box{
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
  color: #fff;
  display: flex;
}
.totop-box .totop{
  color: #fff;
  font-size: var(--body-S);
  line-height: var(--body-S-line-height);
  opacity: 0.8;
  margin-left: auto;
  padding: 19px 0;
  display: flex;
  align-items: center;
}
.totop-box .totop .icons{
  background-image: url(/img/icons/icon-arrow-line-up.svg);
  width: 14px;
  height: 14px;
  margin-left: 9px;
  background-size: 12px;
  margin-top: 2px;
}
.totop-box .totop:hover{opacity: 1;}
 
.footer-main{
  display: flex;
  padding: 50px 0 40px;
  position: relative;
}

.footer-main .logo{
  width: 160px;
  flex-shrink: 0;
}
.footer-main .cols{
  height:300px;
  display: flex;
  flex-direction: column;
}
.footer-main .cols:nth-child(2){
  padding-left:80px;
}
.footer-main .cols:nth-child(3){
  margin-left: auto;
  /* max-width: 320px;
  width: 100%; */
}
.nav-contact{
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 0;
  padding-top: 10px;
}
.nav-contact li{
  display: flex;
}
.nav-contact li a:hover{color: rgba(255, 255, 255, 0.8);}
.nav-contact .icons{
  width: 38px;
  height: 38px; 
  margin-right: 12px;
}
.nav-contact .icons:before{opacity: 1;}
.nav-contact .icons:after{ opacity: 0;}
.nav-contact .icon-call:before{background-image: url(/img/icons/icon-call.svg);}
.nav-contact .icon-call:after{background-image: url(/img/icons/icon-call-orange.svg);}
.nav-contact .icon-email:before{background-image: url(/img/icons/icon-email.svg);}
.nav-contact .icon-email:after{background-image: url(/img/icons/icon-email-orange.svg);}

.nav-contact li:hover .icons:before{opacity: 0;}
.nav-contact li:hover .icons:after{ opacity: 1;}

.nav-link-s{
  gap: 30px;
  color: rgba(255, 255, 255, 0.8);
}
.nav-link-s li a{
  font-size: var(--body-S);
  line-height: var(--body-S-line-height);
  color: inherit;
}
.nav-link-s li a:hover{
  color: rgba(255, 255, 255, 1);
}

.nav-followus{
  gap:20px;
  max-width: 225px;
  padding-top:10px;
} 
.nav-followus .icons{
  width: 38px;
  height: 38px;
  border-radius: 50%; 
}
.nav-followus .icons:before{opacity: 1;}
.nav-followus .icons:after{ opacity: 0;}

.nav-followus .icons:hover:before{opacity: 0;}
.nav-followus .icons:hover:after{ opacity: 1;}

.nav-followus .icon-facebook:before{background-image: url(/img/icons/icon-facebook.svg);}
.nav-followus .icon-facebook:after{ background-image: url(/img/icons/icon-facebook-colorful.svg);}

.nav-followus .icon-instagram:before{background-image: url(/img/icons/icon-instagram.svg);}
.nav-followus .icon-instagram:after{ background-image: url(/img/icons/icon-instagram-colorful.svg);}

.nav-followus .icon-twitter:before{background-image: url(/img/icons/icon-twitter.svg);}
.nav-followus .icon-twitter:after{ background-image: url(/img/icons/icon-twitter-colorful.svg);}

.nav-followus .icon-line:before{background-image: url(/img/icons/icon-line.svg);}
.nav-followus .icon-line:after{ background-image: url(/img/icons/icon-line-colorful.svg);}

.nav-followus .icon-in:before{background-image: url(/img/icons/icon-linkedIN.svg);}
.nav-followus .icon-in:after{ background-image: url(/img/icons/icon-linkedIN-colorful.svg);}

.nav-followus .icon-youtube:before{background-image: url(/img/icons/icon-youtube.svg);}
.nav-followus .icon-youtube:after{ background-image: url(/img/icons/icon-youtube-colorful.svg);}

.nav-followus .icon-blockdit:before{background-image: url(/img/icons/icon-blockdit.svg);}
.nav-followus .icon-blockdit:after{ background-image: url(/img/icons/icon-blockdit-colorful.svg);}

.nav-followus .icon-youtube:before{background-image: url(/img/icons/icon-youtube.svg);}
.nav-followus .icon-youtube:after{ background-image: url(/img/icons/icon-youtube-colorful.svg);}

.nav-followus .icon-tiktok:before{background-image: url(/img/icons/icon-tiktok.svg);}
.nav-followus .icon-tiktok:after{ background-image: url(/img/icons/icon-tiktok-colorful.svg);}
 
.footer-main .cols:nth-child(4){display:none}

.nav-followus.colorful .icons:before{display: none;}
.nav-followus.colorful .icons:after{display: block;opacity: 1;}

@media (max-width:1024px) {
  .footer:before{
    right: 50%;
  }
}
@media (max-width:991.98px) {
  .footer-main{
    flex-wrap: wrap;
    padding-top: 35px;
  }
  .footer-main .logo{
    width: 120px;
    margin-bottom: 35px;
  }
  .footer-main .cols{}
  .footer-main .cols:nth-child(1){
    width: 100%;
    height: auto;
  }
  .footer-main .cols:nth-child(2),
  .footer-main .cols:nth-child(3){
    padding-left: 0;
    height: 350px;
  }

  .footer:before{
    background-size: 200%;
    right: auto;
    width: 100%;
    left: -20%;
    background-position: bottom left;
  }

  .nav-contact li > div{
    position: relative;
    padding-left: 55px;
  }
  .nav-contact li .icons{
    position: absolute;
    left: 0;
    top: 10px;
  }

  .nav-link-s{
    gap: 25px;
  }
 
}

@media (max-width:720px) {
  .nav-link-s{
    gap: 15px;
  }
}
@media (max-width:690px) {
  .footer-main{padding-bottom: 0;}
  .footer-main .cols:nth-child(2) .nav-link-s,
  .footer-main .cols:nth-child(3) .nav-link-s{display: none;}
  .footer-main .cols:nth-child(4){
    display: block;
    height: auto;
    padding: 20px 0;
    width: 100%; 
    margin-top: 25px;
  }

  .footer-main .cols:nth-child(4) hr{
    border-top:  1px solid rgba(255, 255, 255, 0.25);;
    opacity: 1;
    margin-top: 35px; 

  }
}
@media (max-width:650px) {
  .footer-main{
    flex-direction: column;
  }
  .footer-main .cols{height: auto !important;}
  .footer-main .cols:nth-child(2),
  .footer-main .cols:nth-child(3){
    width: 100%;
  }

  .footer-main .cols:nth-child(3){
    padding-top:40px;
  }
  .nav-followus{
    max-width: 300px;
  }
}

@media (max-width:576px) {
  .footer-main .cols:nth-child(4){
    padding: 15px 0;
  }
  .footer-main .cols:nth-child(4) hr{
    margin-bottom: 10px;
  }

  .totop-box .totop{
    padding: 15px 0;
  }

  .footer:before{
    background-size: 100%;
    right: auto;
    width: 100%; 
    left: 0;
    top: 0;
    background-position: top center;
    background-size: cover;
    background-image:url(/img/thumb/footer-bg-mobile.png)
  }
}



/*=========Cookie Policy=========*/

.cookie-policy{
  background-color:var(--light-blue);
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  padding:20px 0 20px 0;
  color: #fff;
  font-size: var(--body-S);
  line-height: var(--body-S-line-height); 
  z-index: 1000;  

  transition: -webkit-transform .6s ease;
  transition: transform .6s ease;
  transition: transform .6s ease, -webkit-transform .6s ease;

  -webkit-transform: translate(0, 100%);
    -ms-transform: translate(0, 100%);
    transform: translate(0, 100%);
    -webkit-transform: translate3d(0, 0, 100%);
    transform: translate3d(0, 0, 100%);
}

.cookie-policy.cookie-show{
  -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.cookie-policy a{
  color:#fff; 
  text-decoration: underline;
}
.pc .cookie-policy a:hover{
  opacity: 0.8; 
}
 
.cookie-policy .cols:nth-child(2){
  margin-left: auto;
}

.cookie-policy .container{
  display: flex;
  align-items: center;
}
.cookie-policy .buttons{
  padding: 0;
  display: flex; 
}
.cookie-policy .btn{ 
  border-color: #fff;
  background-color: transparent;
  color: #fff;
  border-radius: 5px;
  height: 40px;
  line-height: 38px;
  width: 120px;
  font-weight: 400;
} 
.pc .cookie-policy .btn:hover{
  border-color: var(--highlight-color-1);
  background-color: var(--highlight-color-1);
  color: #fff;
}
.device .cookie-policy .btn{
  border-color: #fff;
  background-color: transparent;
  color: #fff;
  font-weight: 300;
}
 
@media (max-width:1024px){
  .cookie-policy{ 
    font-size: var(--body-XS);
    line-height: var(--body-XS-line-height);
  }
  .cookie-policy .container .cols:nth-child(1){
    padding-right: 30px;
  }
}
@media (max-width:576px){
  .cookie-policy{
    padding: 15px 0;
  }
  .cookie-policy .container {
    flex-direction: column;
    gap:12px;
  }
  .cookie-policy .btn{
    width: 100%;
  }
  .cookie-policy .container .cols:nth-child(1),
  .cookie-policy .container .cols:nth-child(2){
    padding: 0px;
    width: 100%;
  }
}


/*==================================================
   Login
==================================================*/ 

.header .goback{ 
  display: block;
  width: 38px;
  height: 38px;
  margin-left: auto;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url(/img/icons/icon-modal-close.svg);
  transition: all 0.25s;
}
.pc .header .goback:hover{
  background-image: url(/img/icons/icon-modal-close-orange.svg);
}

.page-register{
  background-color:#d8dff1;
  min-height: 100vh; 
  background-image: url(/img/thumb/bg-register.jpg);
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size:contain;
}
.page-register .header{
  padding: 40px 0;
  position: absolute;
}
.page-register .section-body{
  padding: 0;
}
.card-form{
  background-color: #fff;
  width: 100%;
  max-width: 763px;
  margin: 0 auto;
  display: block;
  padding: 40px 50px;
}

.card-form.bg-none{
  padding-left: 0;
  padding-right: 0;
  background-color:transparent;
}
.card-form.bg-none .button-group {
  margin: 0 !important;
  padding: 0 !important;
}
.form .link,
.form-infos .link{
  color: var(--black);
  font-size: var(--body-M);
  line-height: var(--body-M-line-height);
  display: inline-block;
  border-bottom: 1px solid var(--black);
  line-height: 1;
}
.pc .form .link:hover,
.pc .form-infos .link:hover{
  color: var(--primary-color);
  border-color: var(--primary-color);
}

.form-infos .link{font-size:inherit; }

.form-infos{
  display: block;
  padding: 35px 0;
}
 
.form-infos .fs-small{
  font-size: var(--body-S);
  line-height: var(--body-S-line-height);
  padding-top: 10px;
}

.member-category-box{
  display: block;
  padding: 19px 0 25px;
}
.member-category-box .nav{
  gap: 25px;
}

.member-category-box .business-option{
  margin-top: 20px;  
  display: none;
}
 
@media (max-width:1100px){
  .page-register{
    padding-top: 98px;
  }
  .page-register .header{
    padding:30px 0;
  }

  .page-register .section-body{
    padding-top: 30px;
  }
  
}

@media (max-width:576px){
  .page-register{
    padding-top: 65px;
    background-size: 120%;
  }
  .page-register .header{
    padding: 16px 0 20px;
  }
  
  .page-register .section-body{
    padding: 0;
  }

  .header .goback{
    width: 24px;
    height: 24px;
  }

  .card-form{
    padding: 20px;
  }
  .card-form .title-icons{
    font-size: var(--body-M);
    line-height:var(--body-M-line-height);
  }

  .form-infos{
    padding: 20px 0;
  }

  .card-form  .form-completed{
    padding: 25px 20px 30px;
  }
}


/*==================================================
   Contact
==================================================*/ 
.card-contact{
  background-color: #ffffff;
  padding: 25px 50px;
  margin-bottom: 40px;
}
.card-contact .card-header{
  border-bottom:1px solid #CECEDD;
  padding: 10px 0 10px;
  margin-bottom: 0;
}
.card-contact .card-header h5{
  font-size:var(--body-M) ;
  color: var(--light-blue);
  font-weight: 500;
}
.card-contact .card-body{
  padding: 40px 0;
}
.card-contact .infos{margin-top: auto; margin-bottom: auto;}
#contact-ads-info-1 .infos{white-space: nowrap;}
.google-map{
  display: block;
  margin: 5px 0;
  width: 100%; 
  height: 280px;
}
.google-map iframe{
  width: 100%;
  height: 100%;
  border:0
}
.card-contact .nav-followus.colorful{
  max-width: 100%; 
  gap: 40px;
  padding-top: 5px;
}
.card-contact .nav-followus.colorful li.emty{
  display: none

}
.card-contact .nav-followus.colorful .icons{
  width: 48px;
  height: 48px;
}
.pc .card-contact .nav-followus.colorful .icons:hover{opacity: 0.8;}

.contact-infos{
  display: flex;
  gap: 30px;
  padding-top:  5px;
  font-size: var(--body-L);
  line-height: var(--body-L-line-height);
}
.contact-infos p{
  margin: 0;
}
.contact-infos .icons{
  width: 48px;
  height: 48px;
  border-radius: 50%; 
  flex-shrink: 0;
  margin-top: auto;
  margin-bottom: auto;
}
.contact-infos .icon-phone{background-image: url(/img/icons/icon-circle-contact.svg);}
.contact-infos .icon-email{background-image: url(/img/icons/icon-circle-email.svg);}

.pc .contact-infos a:hover{color: var(--primary-color);}
.contact-infos:nth-child(2){
  margin-left: 50px;
}

.company-infos{
  display: flex;
  gap: 55px;
}
.company-infos .logo{
  width: 180px;
}
.company-infos h3{
  margin: 0 0 13px;
}

.company-infos p{
  margin: 0;
}

@media (max-width:1440px){
  .google-map{ 
    height: 240px;
  }
}

@media (max-width:1024px){
  .google-map{
    margin: 0;
    max-width: 100%;
  }

  .card-contact .card-body{
    padding: 30px 0;
  }
}

@media (max-width:991.98px){
  .card-contact{
    padding:15px 35px;
    margin-bottom:30px;
  }

  .card-contact .nav-followus.colorful {
    
    gap: 25px;
  }

  .contact-infos:nth-child(2){
    margin-left: 0;
    margin-top: 20px;
  }

  .company-infos{
    gap:35px;
    font-size: var(--body-S);
    line-height: var(--body-S-line-height);
  }
  .company-infos h3{
    font-size: var(--body-L);
    line-height: var(--body-L-line-height);
    margin-bottom: 5px;
  }
  .company-infos .logo{
    width: 135px;
  }
}

@media (max-width:576px){
  .google-map{ 
    height: 220px;
  }

  .card-contact{
    padding:10px 20px;
    margin-bottom:15px;
  }
  .card-contact .card-header{
    padding: 7px 0 7px;
  }
  .card-contact .card-body{
    padding: 20px 0;
  }

  .card-contact .nav-followus.colorful {
    justify-content: space-between;
    gap: 10px;
  }
  .card-contact .nav-followus.colorful li.emty{
    width: 100%;
    display: block;
  }

  .contact-infos{
    gap:18px;
    margin-top: 0;
  }
  .contact-infos .icons {
    margin-top: 10px;
  }

  .contact-infos a.email{
    font-size: var(--body-M);
    line-height: var(--body-M-line-height);
    margin-top: -5px;
    display:block;
  }
  .contact-infos:nth-child(2){
    margin-bottom: 10px;
    margin-top: 18px;
  }

  .company-infos{
    flex-direction: column;
    gap: 0;
  }
  .company-infos .logo{
    width: 112px;
    margin-top:3px;
  }
  .company-infos h3{
    margin-top: 15px;
  }

  .company-infos{ 
    font-size: var(--body-M);
    line-height: var(--body-M-line-height);
  }
}


/*==================================================
   Profile
==================================================*/ 

.section-profile .container{
  display: flex;
  gap: 70px;
}
.section-profile .sidebar{
  flex-shrink: 0;
  width: 328px;
  background-color: #fff;
  text-align: center;
  padding: 45px 0 35px;
}
.section-profile .content{
  background-color: #fff; 
  flex: 1 0 0%;
  padding: 50px;
}
.sidebar .member-infos .avatar,
.sidebar .member-infos .member-type{
  margin-left: auto;
  margin-right: auto;
} 
.sidebar .member-infos{
  padding: 0;
}
.sidebar .member-infos hr{
  margin: 40px 0 20px;
  border-color: var(--light-blue-10);
  opacity: 1;
}

.sidebar .member-infos li.active a{
  color: var(--highlight-color-1);
}
.sidebar .nav-member{
  padding: 0 30px;
}
.section-profile .title{
  display: flex;
  align-items: baseline;
}
.section-profile .title .vr{
  margin: 0;
  background-color: var(--highlight-color-1);
  width: 2px;
  opacity: 1;
  margin-right: 15px;
  height: 38px;
}

.section-profile .content .card-form{
  padding:20px 0 0 0;
}

.modal-formSave{
  --bs-modal-margin:80px;
  --bs-modal-width: 400px;
}
.modal-formSave .modal-content{
  border:1px solid var(--green);
  border-radius: 3px;
  padding: 20px;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.05);
}
.modal-formSave .modal-content.d-flex{
  align-items: center;
  flex-direction: row;
  gap:15px;
  font-weight: 500;
}
.modal-formSave .icon-noti{
  width: 38px;
  height: 38px;
}
.modal-formSave .icon-noti img{
  vertical-align: top;
}
.modal-formSave .btn-close{
  width: 20px;
  height: 20px;
  top: 10px;
  right: 10px;
  z-index: 100;
}
.modal-formSave .btn-close:before {
  opacity: 1 !important;
  background-image: url(/img/icons/icon-modal-close-small.svg);
  opacity: 1;
}
.modal-formSave .btn-close:after {
  opacity: 0;
  display: none;
}
.pc .modal-formSave .btn-close:hover{
  opacity: 0.5;
}

@media (max-width:1280px){
  .section-profile .container{gap:40px;}
}
@media (max-width:1024px){
  .section-profile .sidebar{
    display: none;
  }
  .section-profile .content{
    margin: 10px 0;
  }
}
@media (max-width:991.98px){
  .section-profile .content{
    margin: 0; 
  }
}
@media (max-width:670px){
  .section-profile .content{
    padding: 20px 20px 30px;
  }
}