.content-section-loading
{
      width: 100%;
      height: auto;      
      font-family: "Figtree", sans-serif;
}
.content-section-loading
.loading-container
{
      z-index: 100;      
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      position: fixed;
      overflow: hidden;                 
}
.content-section-loading
.loading-background
{     
      top: 10%;      
      width: 100%;      
      position: relative;
}
.content-section-loading
img
{           
      width: 350px;
      height: 500px;           
      display: block;            
      object-fit: cover;
      margin-left: auto;
      margin-right: auto;             
      border-radius: 99px;            
      background-repeat: no-repeat;
      background-position: center center;
}
.content-section-loading
.loading-article
{          
      top: 12%;      
      width: 100%;      
      position: relative;
}
.content-section-loading
.loading-article
h5
{                       
      font-size: 30px;
      color: #026937;        
      font-weight: 900;
      text-align: center;            
      text-transform: uppercase;
}
.content-section-loading
.loading-article
span
{                               
      font-size: 30px;      
      color: #232323; 
      font-weight: 900;                        
      text-align: center;                 
      text-transform: uppercase;
}
.content-section-loading
.loading-article
p
{             
      font-size: 12px;       
      margin-top: 8px;
      margin-left: 8%;
      font-weight: 500;            
      text-align: center;    
      font-family: "Sora", sans-serif;       
}
.content-section-loading
.loading-span
{     
      z-index: 11;
      top: 80%;      
      width: 50px;
      height: 50px;      
      display: block;
      margin: 0 auto;
      position: relative;      
      border-radius: 50%;    
      border: 1px solid transparent;
      border-top-color: #888;
      
      animation: animate-loading 1.7s linear infinite;    
}
.content-section-loading
.loading-progress
{
      z-index: 10;
      top: 0;
      width: 100%;
      height: 100vh;
      margin: 0 auto;
      position: fixed;
      background-color: #f6f7f8;  
      /*      
      background-color: #f4f6f6;            
      */
}
.loading-script
.loading-span
{
      opacity: 0;
      transition: all 0.3s ease-out;
}
.loading-script
.loading-container
{
      visibility: hidden;
      transform: translateY(0%);
      transition: all 0.0s 0s ease-out;
}
.content-section-loading
.loading-copyright
{            
      bottom: 0;
      right: 5px;
      position: absolute;
}
.content-section-loading
.loading-copyright
p
{      
      padding: 40px;      
      font-size: 12px;
      color: #232323;
      font-weight: 500;
      font-family: "Sora", sans-serif;
}



.content-section-carousel
{      
      width: 100%;
      height: auto;      
      margin-top: 20px;
      font-family: "Figtree", sans-serif;      
}
.content-section-carousel
.carousel-container
{          
      width: 95%;
      height: 90vh;                      
      border-radius: 20px;         
}
.content-section-carousel
.carousel-box
{
      width: 100%;
      height: 90vh;
      margin: 0 auto;            
}
.content-section-carousel
img
{
      width: 100%;
      height: 100%;
      object-fit: cover;     
      background-position: center;
      background-repeat: no-repeat;	
}
.content-section-carousel
.carousel-heading
{      
      top: 0;
      left: 0;    
      width: 100%;
      height: 100%;
      display: flex;
      position: absolute;      
      align-items: center;
      flex-direction: column;
      justify-content: center;      
}
.content-section-carousel
h5
{      
      font-size: 20px;
      color: #91d17d;
      font-weight: 700;            
}
.content-section-carousel
h6
{
      color: #fff;
      font-size: 50px;
      font-weight: 700;
      text-align: center;
      text-transform: uppercase;
      font-family: "Nanum Myeongjo", serif;      
}
.content-section-carousel
.swiper-pagination-bullet
{
      opacity: 0.8;      
      width: 10px;
      height: 10px;
      background-color: #ccc;
      
      transition: 0.3s;
}
.content-section-carousel
.swiper-pagination-bullet-active
{      
      opacity: 1;
      width: 20px;
      border-radius: 7px;
      background-color: #fff;
}
.content-section-carousel
.swiper-button-prev,
.content-section-carousel
.swiper-button-next
{            
      color: #242424;      
      padding: 20px 22px;
      border-radius: 50%;
      background-color: #fff;

      transition: all 0.5s ease-in;
}
.swiper-button-next:hover 
{
      border: none;
      color: #fff;   
      outline: none;               
      font-size: 12px;
      font-weight: 700;
     
      border: 1px solid #fff;
      background-color: transparent;     
}
.swiper-button-prev:hover 
{
      border: none;
      color: #fff;   
      outline: none;               
      font-size: 12px;
      font-weight: 700;
      border: 1px solid #fff;
      background-color: transparent;     
}
.swiper-button-next::after,
.swiper-button-prev::after 
{
      font-size: 15px;
      font-weight: 700;
}



.content-section-navigate
{
	width: 100%;
	height: auto;      	  
      font-family: "Figtree", sans-serif;  
}
.content-section-navigate
.navigate-container
{
      width: 100%;
      height: 5vh; 
      padding: 1% 0%;	        
      text-align: center;      
}
.content-section-navigate
p
{            
      color: #333; 
      font-size: 12px; 
      font-weight: 500;      
}
.content-section-navigate
span 
{
	font-size: 12px; 
      color: #44862f;	  
      font-weight: 500;
}



.content-section-spam
{
	width: 100%;
	height: auto;
      margin-top: 20px;
	background-color: transparent;
      font-family: "Figtree", sans-serif;  
}
.content-section-spam
.spam-container
{
      width: 100%;
      height: 20vh;
      display: flex;
      padding: 1% 8%;	              
      align-items: center;
      justify-content: center;      
      background-color: transparent;
}
.content-section-spam
h6
{                  
      font-size: 18px;            
      color: #44862f; 
      font-weight: 700;                  
}
.content-section-spam
p
{            
      color: #222; 
      font-size: 45px; 
      font-weight: 700;
      text-transform: uppercase;
      font-family: "Nanum Myeongjo", serif;           
}



.content-section-flexbox
{
      width: 100%;
      height: auto;
      background-color: transparent;
      font-family: "Figtree", sans-serif;  
}
.content-section-flexbox
.flexbox-container
{
      width: 100%;            
      margin: 0 auto;
      
      padding: 5px 10px;
      max-width: calc(150rem + 10vw);
}
.content-section-flexbox
.flexbox-container *:first-child 
{
      margin-block-start: 0;
}
.content-section-flexbox
.flexbox-article
{
      width: 95%; 
      height: 5vh;
      margin: 0 auto;
}
.content-section-flexbox
.flexbox-article
h5
{      
      font-size: 15px; 
      font-weight: 500;
}
.content-section-flexbox
.flexbox-article
span
{      
      width: 50%; 
      float: right;       
      font-size: 12px; 
      text-align: right; 
      margin-top: -15px;      
}
.content-section-flexbox
.flexbox-box
{      
      gap: 2rem;
      height: 25vw;
      display: flex;
      overflow-x: auto;
      min-height: 20rem;
      min-height: 40rem;
      position: relative;      
      overflow-y: hidden;
      border-radius: 35px;           
      scroll-behavior: auto;
      scrollbar-width: none;
      outline: none !important;
      scroll-snap-type: x mandatory;      
      -webkit-overflow-scrolling: touch; 
}
.content-section-flexbox
.flexbox-box::-webkit-scrollbar 
{
      display: none;
}
.content-section-flexbox
.flexbox-box > div:empty 
{
      position: relative;
}
.content-section-flexbox
.flexbox-box > div:empty:first-child 
{
      inset-inline-start: 10%;
      margin-inline-end: calc(-1 * var(--carousel-gap));
}
.content-section-flexbox
.flexbox-box > div:empty:last-child 
{
      inset-inline-end: 10%;
      margin-inline-start: calc(-1 * var(--carousel-gap));
}
.content-section-flexbox
.flexbox-item
{     
      display: grid;
      flex: 1 0 auto;
      max-width: 100%;       
      min-height: 100%;     
      position: relative;
      scroll-snap-align: start;
      grid-template-columns: 1fr;
      aspect-ratio: var(--card-ratio); --card-ratio: ;
      grid-template-rows: [media-start] auto [media-end main-start] auto [main-end];      
}
.content-section-flexbox
.flexbox-flex
.flexbox-item
{      
      flex: 1 0 100%;
      aspect-ratio: auto;
}
.content-section-flexbox
.flexbox-overlay
{      
      --card-link-color: var(--theme-white);
      --card-hover-color: var(--theme-white);
      --card-shadow-color: var(--theme-black);
      --card-background-color: var(--theme-dark);
      --card-foreground-color: var(--theme-white);      
      grid-template-rows: [media-start] 1fr [overlay-start] 1rem [main-start] auto [main-end overlay-end media-end];
}
.content-section-flexbox
.flexbox-overlay::before 
{
      content: "";
      grid-column: 1/-1;
      grid-row: overlay-start/overlay-end;
      
      display: block;
      overflow: hidden;      
      border-bottom-left-radius: 1rem;
      border-bottom-right-radius: 1rem;
      background: linear-gradient(to top, hsla(var(--card-shadow-color), 0.8) 20%, hsla(var(--card-shadow-color), 0.3) 60%, transparent);
}
.content-section-flexbox
.flexbox-rounded
{
      --card-ratio: auto 1.8/1;
}
.content-section-flexbox
.flexbox-banner
{
      --card-ratio: auto 4/3;
}
.content-section-flexbox
.flexbox-portrait
{
      --card-ratio: auto 3/4;
}
.content-section-flexbox
.flexbox-wide
{
      --card-ratio: auto 2/1;
}
.content-section-flexbox
.flexbox-background
{
      z-index: -1;     
      grid-column: 1/-1;
      
      max-width: 100%;
      overflow: hidden;
      position: relative;
      aspect-ratio: auto;
      border-radius: 1rem;
      aspect-ratio: var(--card-ratio);
      grid-row: media-start/media-end;
}
.content-section-flexbox
.flexbox-background > * 
{
      width: 100%;
      height: 100%;
      object-fit: cover;
      position: absolute;      
      border-radius: inherit;
}
.content-section-flexbox
img 
{      
      height: auto;
      display: block;
      max-width: 100%;
}
.content-section-flexbox
.flexbox-context 
{     
      color: #fff; 
      align-self: end;
      padding: 1.25rem;      

      grid-column: 1/-1;
      grid-row: main-start/main-end;     
}
.content-section-flexbox
.flexbox-context > * 
{
      margin: 0;
}
.content-section-flexbox
h6
{               
      font-size: 50px;
      font-weight: 700; 
      font-family: "Nanum Myeongjo", serif;   
}
.content-section-flexbox
.flexbox-context 
p 
{
      color: #fff;
      font-size: 15px;
      font-weight: 500;
      margin-block: 5px;
      text-shadow: 0 0.0625rem 0.0625rem hsl(var(--card-shadow-color));
      font-family: "Nanum Myeongjo", serif;   
}
.content-section-flexbox
.arrow
{
      opacity: 1;
      width: 3rem;
      height: 3rem;
      border: none;
      display: flex;      
      cursor: pointer;      
      padding: 0.5rem;
      appearance: none;
      align-items: center;      
      background: transparent;      
      justify-content: center;
      border-radius: 0.125rem;      
      color: hsl(var(--theme-blue));            
      
      transition: opacity 150ms, color 150ms;      
}
.content-section-flexbox
.arrow:hover 
{
      color: hsl(var(--theme-red));
}
.content-section-flexbox
.arrow:focus 
{
      color: hsl(var(--theme-pink));
      outline: none;
}
.content-section-flexbox
.arrow:focus 
svg 
{
      box-shadow: 0 0 0 0.125rem hsla(#ccc, 1), 0 0 0 0.25rem currentColor;
}
.content-section-flexbox
.arrow:focus:not(:focus-visible) 
{
      color: hsl(var(--theme-red));
}
.content-section-flexbox
.arrow:focus:not(:focus-visible) 
svg 
{
      box-shadow: none;
}
.content-section-flexbox
.arrow[disabled] 
{      
      opacity: 0.5;      
      color: #bbb;
      pointer-events: none;
}
.content-section-flexbox
svg 
{     
      width: 100%;
      height: 100%;
      fill: currentColor;
      border-radius: 100%;      
      transition: box-shadow 150ms;
}
[dir=rtl] 
.arrow 
svg 
{
      transform: scaleX(-1);
}
.content-section-flexbox
.flexbox-pagination
{      
      display: flex;      
      align-items: center;
      margin: 1rem -0.5rem;
      justify-content: center;      
}
.content-section-flexbox
.arrow 
{
      flex: 0 0 auto;
}
.content-section-flexbox
.arrow:first-of-type 
{
      
      order: -1;
      margin-inline-end: auto;
}
.content-section-flexbox
.arrow:last-of-type 
{      
      order: 1;
      margin-inline-start: auto;
}
.content-section-flexbox
.flexbox-dots
{         
      display: none;
      /*
      display: flex;
      */
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
}
.content-section-flexbox
.flexbox-dot
{
      width: 1.5rem;      
      height: 1.5rem;
      display: block;
      position: relative;
      border-radius: 100%;
}
.content-section-flexbox
.flexbox-dot::after 
{
      content: "";
      top: 50%;
      left: 50%;      
      display: block;      
      width: 0.375rem;
      height: 0.375rem;
      position: absolute;
      border-radius: 100%;
      background: currentColor;
      transform: translateX(-50%) translateY(-50%);
}
.content-section-flexbox
.flexbox-activated 
{
      color: hsl(var(--theme-pink)) !important;
}
.content-section-flexbox
.flexbox-span
{
      border: 0 !important;      
      width: 1px !important;
      padding: 0 !important;
      height: 1px !important;      
      margin: -1px !important;
      overflow: hidden !important;      
      position: absolute !important;      
      white-space: nowrap !important;
      clip: rect(0 0 0 0) !important;
      clip-path: inset(50%) !important;
}




.content-section-flexbase
{      
      width: 100%;
      height: auto;
      font-family: "Figtree", sans-serif;
}
.content-section-flexbase
.flexbase-container
{      
      width: 100%;
      height: 30vh;
      display: flex;      
      align-items: center;
      justify-content: center;                  
      background-color: transparent;
}
.content-section-flexbase
.flexbase-box
{          
      display: grid;                  
      border-radius: 30px;       
      
      grid-template-columns: repeat(7, 1fr);
}
.content-section-flexbase
.flexbase-item
{          
      width: 200px;     
      height: 200px;
      display: block;           
      text-align: center;        
      border-radius: 9999px;      
}
.content-section-flexbase
img
{      
      z-index: 10;          
      width: 120px;
      margin: 20px;
      height: 120px;            
      object-fit: cover;
      border-radius: 50%;  
}
.content-section-flexbase
h6 
{          
      font-size: 14px;
      color: #0a5c36;      
      font-weight: 700;
      margin-top: -10px;      
}
.content-section-flexbase
.flexbase-toggle
{          
      cursor: pointer;
      position: relative;
}
.content-section-flexbase
.flexbase-toggle::before 
{          
      top: 20px;
      left: 50px;      
      height: auto;
      position: absolute;
      border-radius: 15px;  
      background-color: #fff;      
      content: attr(aria-label);  

      transition: all 0.5s ease;  
}
.content-section-flexbase
.flexbase-toggle::before, 
.content-section-flexbase
.flexbase-toggle::after 
{          
      opacity: 0;          
      width: 80%;  
      padding: 15px;      
      font-size: 14px;      
      color: #242424;  
      line-height: 1.5;
      font-weight: 500;      
      pointer-events: none;            
}
.content-section-flexbase
.flexbase-toggle:focus::before,
.content-section-flexbase
.flexbase-toggle:focus::after, 
.content-section-flexbase
.flexbase-toggle:hover::before, 
.content-section-flexbase
.flexbase-toggle:hover::after 
{         
      opacity: 1;
      width: 80%;
      transition: all 0.75s ease;
}



.content-section-mapping
{
      width: 100%;
      height: auto;
      background-color: transparent;         
      font-family: "Figtree", sans-serif;
}
.content-section-mapping
.mapping-container
{          
      width: 100%;
      height: auto;
      display: flex;
      margin: 0 auto;
      flex-wrap: wrap;                       
      background-color: transparent;
      /*
      background-color: #f3f1ee;
      **/
}
.content-section-mapping
.mapping-a
{      
      width: 44%;         
      height: 80vh;      
}
.content-section-mapping
.mapping-article
{
      width: 100%;
      padding: 20% 35%;              
}
.content-section-mapping
h5
{
      float: left;      
      font-size: 80px;
      color: #0a5c36;
      font-weight: 900;           
      padding: 15px 15px;      
      font-family: "Nanum Myeongjo", serif;
}
.content-section-mapping
h6
{            
      font-size: 18px;
      color: #242424; 
      font-weight: 500;
      line-height: 1.2;
      padding: 50px 20px;            
}
.content-section-mapping
.mapping-b
{      
      width: 55%;         
      height: 80vh;      
}
.content-section-mapping
.mapping-box 
{
      display: flex;    
}
.content-section-mapping
.mapping-box 
h4
{      
      padding: 8px;      
      font-size: 15px;
      color: #242424;
      font-weight: 700;
      text-align: center;      
      text-transform: uppercase;
      font-family: "Sora", sans-serif;
}
.content-section-mapping
.mapping-box > * 
{    
      padding: 8px;
      width: calc(100% / 3);
}
.content-section-mapping
.box-a
{
      width: 25%;
      height: 100vh;      
}
.content-section-mapping
.box-b
{
      width: 25%;
      height: 100vh;      
}
.content-section-mapping
.box-c
{
      width: 25%;
      height: 100vh;      
}
.content-section-mapping
img
{
      width: 100%;
      height: 40%;
      object-fit: cover;
      border-radius: 30px;
}
.content-section-mapping
.box-a
img
{      
      margin-top: 65%;
}
.content-section-mapping
.box-b
img
{
      margin-top: 90%;
}
.content-section-mapping
.box-c
img
{
      margin-top: 70%;
}



.content-section-tier
{
      width: 100%;
      height: auto;      
      background-color: transparent;
}
.content-section-tier
.tier-container
{      
      width: 100%;
      height: 90vh;
      display: flex;
      padding-top: 80px;          
      background-color: #fff;
      font-family: "Figtree", sans-serif;      
}
.content-section-tier
.tier-a
{              
      width: 33.33%;             
}
.content-section-tier
.tier-article
{
      top: 30%;
      width: 40%;            
      float: right;
      height: auto;      
      position: relative;
}
.content-section-tier
h4
{           
      font-size: 40px;
      color: #242424;  
      margin-top: 40px;
      font-weight: 700;
      text-transform: uppercase;      
}
.content-section-tier
.tier-article
p
{            
      color: #666;      
      padding: 10px 0;
      font-size: 15px;
      font-weight: 500;
      line-height: 1.5;            
}
.content-section-tier
.tier-heading
{        
      top: 50%;
      left: 25%;
      width: 50%;
      color: #fff;    
      font-size: 30px;      
      font-weight: 700;
      position: absolute;        
}
.content-section-tier
.tier-b
{                
      height: auto;     
      width: 33.33%;           
      position: relative;
      text-align: center;
}
.content-section-tier
.tier-background
{
      width: 80%;
      height: auto;
      margin: 0 auto;
}
.content-section-tier
img
{
      width: 90%;
      height: auto;      
      object-fit: cover;
      border-radius: 15px;
}
.content-section-tier
.tier-c
{          
      height: auto;     
      width: 33.33%;           
}
.content-section-tier
.tier-conext
{
      top: 30%;
      width: 40%;                  
      height: auto;
      position: relative;
}
.content-section-tier
h6
{           
      font-size: 15px;
      color: #242424; 
      margin-top: 40px;
      font-weight: 700;
      text-transform: uppercase;      
}
.content-section-tier
.tier-conext
p
{            
      color: #666;       
      padding: 10px 0;      
      font-size: 15px;
      font-weight: 500;
      line-height: 1.5;            
}



.content-section-flexcontainer
{
      width: 100%;
      height: auto;
      background-color: transparent;
      font-family: "Figtree", sans-serif;  
}
.content-section-flexcontainer
h5
{
      width: 85%;      
      margin: 0 auto;      
      font-size: 15px;
      color: #242424;
      font-weight: 500;
      padding: 20px 10px;
}
.content-section-flexcontainer
.flexcontainer-container
{
      width: 85%;
      height: auto;
      margin: 0 auto;          
}
.content-section-flexcontainer
.flexcontainer-box
{      
      display: flex;            
}
.content-section-flexcontainer
aside:not(:last-child) 
{
      margin-right: 15px;
}
.content-section-flexcontainer
.flexcontainer-a
{
      width: 68%;
      height: auto;
}
.content-section-flexcontainer
.flexcontainer-b
{
      width: 32%;
      height: auto;
}
.content-section-flexcontainer
img 
{
      width: 100%;
      height: 65vh;      
      object-fit: cover;
      border-radius: 15px;      
}
.content-section-flexcontainer
.swiper-button-next::after, 
.content-section-flexcontainer
.swiper-button-prev::after 
{          
      font-size: 15px;     
}
.content-section-flexcontainer
.swiper-button-prev,
.content-section-flexcontainer
.swiper-button-next 
{     
      width: 40px;
      height: 40px;
      color: #242424;      
      border-radius: 50%;
      background-color: #fff;     

      display: flex;
      align-items: center;
      justify-content: center;

      transition: color 0.3s ease, transform 0.3s ease;
}
.content-section-flexcontainer
.swiper-button-prev:hover,
.content-section-flexcontainer
.swiper-button-next:hover 
{
      color: #fff;     
      border: 1px solid #fff; 
      background-color: transparent; 

      transform: scale(1.05);
}
.content-section-flexcontainer
.swiper-pagination-bullet 
{
      opacity: 1;
      width: 5px;
      height: 5px;
      margin: 0 5px;
      border-radius: 50%;
      background-color: #fff;            

      transition: background-color 0.3s;
}
.content-section-flexcontainer
.swiper-pagination-bullet-active 
{      
      width: 8px;
      height: 8px;
      background-color: #ccc;
}



.content-section-modal
{
      width: 100%;
      height: auto;  
      margin-top: 50px;    
      font-family: "Figtree", sans-serif;
}
.content-section-modal
.modal-container
{
      width: 100%;
      height: auto;
      margin: 0 auto;
      padding-top: 80px;      
      /*
      background-color: #f6f7f8;
      */
}
.content-section-modal
.modal-container
h4
{                 
      font-size: 50px;
      color: #242424;
      font-weight: 700;     
      text-align: center;
      letter-spacing: 1px;
      font-family: "Nanum Myeongjo", serif;
}
.content-section-modal
.modal-container
p
{                 
      padding: 20px 0;
      font-size: 15px;
      color: #242424;
      text-align: center;
      font-style: italic;                  
}
.content-section-modal
button
{	  	
	width: 120px;	      	
      padding: 12px;
      outline: none;            
      color: #fff;
      cursor: pointer;            
	border-radius: 30px;      
	justify-content: center; 	      
      background-color: #242424;      
      /*  	        
      border: 1px solid #ccc;
      background-color: transparent;
      */
}
.content-section-modal
button:hover
{          
      color: #ccc;

      transition: all 0.6s ease-out;
}
.content-section-modal
#modal-button
{      
      font-size: 15px;
      font-weight: 700;      
}
.content-section-modal
.modal-article
{
      height: 10vh;      
      margin: 0 auto;
      max-width: 66%;      
      background-color: transparent;   
      /*
      background-color: #f6f7f8;
      */
}
.content-section-modal
.modal-article
h5
{                 
      font-size: 14px;
      color: #242424;      
      font-weight: 500;           
}
.content-section-modal
.modal-article
h6
{                       
      float: right;      
      margin: -18px 0;      
      font-size: 15px;      
      color: #242424;
      font-weight: 500;              
}
.content-section-modal
.modal-article
hr
{
      margin: 12px 0;
}
.content-section-modal
.modal-article
span
{           
      font-size: 12px;      
      font-weight: 500;     
      color: #242424; 
}    
.content-section-modal
.modal-box 
{      
      z-index: 11;      
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;      
      display: none;
      overflow: auto;
      position: fixed;
      background-color: transparent;            

      animation-name: fadeIn;
      -webkit-animation-name: fadeIn;
      -webkit-animation-duration: 0.4s;      

      animation-duration: 0.4s
}
.content-section-modal
.modal-context
{      
      bottom: 0;
      width: 100%;
      height: 100vh;            
      position: fixed;
      overflow-y: auto;	
      overflow-y: scroll;  	            
      background-color: #f7f6f4;       
      border-radius: 25px 25px 0 0;     
      
      box-shadow: 0px -20px 35px -5px #e4e4e4;     

      transition: all 0.5s ease-out;
      
      animation-name: slideIn;
      animation-duration: 0.4s;
      -webkit-animation-name: slideIn;
      -webkit-animation-duration: 0.4s;   
}
/*
.content-section-modal
.modal-context::-webkit-scrollbar 
{
      width: 5px;
}
      */
.content-section-modal
.modal-context::-webkit-scrollbar-thumb 
{      
      border-radius: 5px;
      background-color: #888;
}
.content-section-modal
.modal-context::-webkit-scrollbar-track 
{ 
      background-color: #fff;
}
.content-section-modal
.modal-span 
{      
      float: left;
      color: #fff;         
      position: fixed;
      font-size: 22px;     
      margin: 15px 15px;
      padding: 5px 12px;
      border-radius: 50%;     
      background-color: rgb(78, 78, 78);

      transition: all 0.5s ease-out;
}
.content-section-modal
.modal-span:hover,
.content-section-modal
.modal-span:focus 
{           
      cursor: pointer;
      color: #242424;     
      background-color: #eee;      
}
.content-section-modal
.modal-arrow
{     
      width: 35px;
      height: 35px;         
      cursor: pointer;            
      position: fixed;     
      margin: 60px 16px;   
      border-radius: 50%;
      border: solid 1px #ccc; 

      transform: rotate(270deg);     

      transition: 0.5s;
}
.content-section-modal
.modal-arrow:hover
{          
      border: solid 1px transparent; 
}
/*
.content-section-modal
.arrow:after
{
      content: "";
      top: -10px;     
      width: 20px;
      height: 15px;      
      display: block;
      color:#232323;      
      position: absolute;
      border-bottom: solid 1px;
      transform: translatex(4px);
}
*/
.content-section-modal
.modal-arrow:before
{
      content: "";
      top: 50%;
      left: 4px;      
      width: 8px;
      height: 8px;        
      display: block;      
      color:#242424;
      position: absolute;
      border-top: solid 2px;
      border-left: solid 2px;
      
      transform-origin: 0% 0%;
      transform: rotatez(-45deg);
}
.content-section-modal
.modal-arrow:hover:before
{      
      animation: animate-arrow 2s cubic-bezier(0, 0.6, 1, 0.4) infinite 0.9s;
      -webkit-animation: animate-arrow 1s cubic-bezier(0, 0.6, 1, 0.4) infinite 0.9s;
}
.content-section-modal
.modal-arrow:hover:after
{      
      animation: animate-border 2s cubic-bezier(0, 0.6, 1, 0.4) infinite 0.9s;
      -webkit-animation: animate-border 1s cubic-bezier(0, 0.6, 1, 0.4) infinite 0.9s;
}
.content-section-modal
.modal-body
{
      width: 80%;      
      height: auto;
      padding: 20px;
      margin: 0 auto;      
}
.content-section-modal
.modal-info
{
      width: 100%;
      height: auto;      
      margin: 0 auto;      
      text-align: center;
}
.content-section-modal
.modal-box
h5
{      
      padding: 40px;
      font-size: 15px;
      color: #242424;
      font-weight: 700;      
      text-transform: uppercase;            
}
.content-section-modal
.modal-background
{
      width: 300px;                 
      margin-top: 30px;
      position: relative;
      display: inline-block;  
      
      transform: translateZ(0);
      -webkit-transform: translateZ(0);
}
.content-section-modal
.modal-background:after 
{      
      transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
}
.content-section-modal
.modal-background:before,
.content-section-modal
.modal-background:after 
{                  
      content: '';
      z-index: -1;      
      top: 0;      
      left: 0;
      right: 0;      
      bottom: 0;      
      position: absolute;
      border-radius: 50%;
      border: 1px solid #bbb;
      border-color: transparent #bbb;
}
.content-section-modal
.modal-background
img 
{
      width: 100%;           
      padding: 20px;          
      border-radius: 50%;
      vertical-align: top;
      backface-visibility: hidden;
}
.content-section-modal
.modal-box
h6
{                
      font-size: 14px;
      color: #242424;
      margin-top: 50px;
      font-weight: 700;                        
}
.content-section-modal
.modal-box
p
{      
      font-size: 14px;
      color: #242424;
      font-weight: 400;      
      line-height: 1.5;      
}
.content-section-modal
.modal-thumbnails
{
      gap: 5px;
      width: 100%;      
      height: 30vh;
      display: flex;
      align-items: center;      
}
.content-section-modal
.modal-thumbnails
img 
{
      width: 200px;
      height: 140px;        
      object-fit: cover;
      border-radius: 10px;
}



.content-section-accordion
{
      width: 100%;
      height: auto;      
      background-color: transparent;
      font-family: "Figtree", sans-serif;
}
.content-section-accordion
.accordion-container
{
      width: 80%;
      height: 60vh;
      margin: 0 auto 0;
      border-radius: 30px;      
      /*
      background: linear-gradient(#fff 23.85%, #f3f1ee00 70.72%);
      */
}
.content-section-accordion
h5 
{          
      font-size: 15px;
      color: #242424;
      font-weight: 700;                  
      padding-top: 50px;
      font-family: "Nanum Myeongjo", serif;  
}
.content-section-accordion
.accordion-list
{     
      padding: 20px 25px;      
}
.content-section-accordion
li 
{      
      position: relative;
      border-bottom: 1px solid #ccc;
}
.content-section-accordion
a 
{
      width: 100%;      
      line-height: 3;
      display: block;
      cursor: pointer;      
      font-size: 18px; 
      color: #242424;
      font-weight: 700;                       
      user-select: none;      
}
.content-section-accordion 
a:after 
{
      content: " ";
      top: 17px;
      width: 15px;
      right: 10px;
      height: 15px;            
      position: absolute;
      border-right: 2px solid #242424;
      border-bottom: 2px solid #242424;      

      transform: rotate(-45deg);
      -moz-transition: all 0.2s ease-in-out;
      -webkit-transition: all 0.2s ease-in-out;      

      transition: all 0.2s ease-in-out;
}
.content-section-accordion
a.active:after 
{
      transform: rotate(45deg);      
      -moz-transition: all 0.2s ease-in-out;
      -webkit-transition: all 0.2s ease-in-out;

      transition: all 0.2s ease-in-out;
}
.content-section-accordion
p 
{            
      display: none;
      color: #6b97a4;
      padding: 10px 25px 30px;
}
.content-section-accordion
p 
{                            
      font-size: 15px;
      color: #242424;      
      font-weight: 400; 
      line-height: 1.5;           
      padding: 5px 0px 20px;            
}



.content-section-testimonial
{
      width: 100%;      
      height: auto;            
      background-color: transparent;
      font-family: "Figtree", sans-serif;
}
.content-section-testimonial
.testimonial-container
{
      width: 100%;
      height: 45vh;
      margin: 0 auto;            
      text-align: center;
      background-color: #f3f1ee;
}
.content-section-testimonial
h5 
{               
      font-size: 12px;
      color: #0a5c36;
      font-weight: 700;       
      padding-top: 40px;      
}
.content-section-testimonial
.testimonial-box
{
      width: 100%;
      height: auto;
      margin-top: 30px;           
}
.content-section-testimonial
.testimonial-avatar
{
      padding: 20px 0;
}
.content-section-testimonial
img 
{
      width: 80px;
      height: 80px;      
      margin: 0 10px;
      cursor: pointer;
      border-radius: 50%;
      filter: grayscale(100%);            

      transition: all .3s ease-in;
}
.content-section-testimonial img:hover, 
.content-section-testimonial img.active 
{          
      filter: none;
}
.content-section-testimonial
.testimonial-article
{
      width: 80%;      
      height: 80px;
      margin: 0 auto;
      padding: 0 10px;            
}
.content-section-testimonial
.testimonial-item
{
      display: none;
}
.content-section-testimonial
.testimonial-item.active 
{
      display: block;
}
.content-section-testimonial
h6
{           
      font-size: 18px;            
      font-weight: 700;  
      padding: 10px 15px;
      text-transform: uppercase;
}
.content-section-testimonial
.testimonial-rating
{                        
      border: none;      
      margin-left: 15px;
      margin-bottom: -2px;
      display: inline-block;
}
.content-section-testimonial
label:before 
{ 
      content: "\f005";
      margin: 2px;
      font-size: 12px;      
      font-family: FontAwesome;     
}
.content-section-testimonial
label 
{       
      float: right; 
      color: #ccc;            
}
.content-section-testimonial
p 
{         
      font-size: 15px;      
      color: #242424;
      padding: 5px 15px;
}



.content-section-brochure
{
      width: 100%;
      height: auto;
      background-color: transparent;
      font-family: "Figtree", sans-serif;
}
.content-section-brochure
.brochure-container
{
      width: 100%;
      height: 25vh;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: #f3f1ee;
}
.content-section-brochure
.brochure-background
{          
      height: 30vh;
      position: relative;
      display: inline-block;            
}
.content-section-brochure
img
{
      width: 240px;
      height: 240px;      
      border-radius: 50%;   
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat;            
}
/*
.content-section-brochure
img:hover
{
      opacity: 0.8;      
      height: auto;            
      margin-left: 2px;
}
.content-section-brochure
.brochure-overlay
{
      z-index: 99;
      top: 0;
      left: 0;
      display: none;
      position: absolute;      

      transition: .2s ease-in-out;
}
.content-section-brochure
.brochure-background:hover
.brochure-overlay
{      
      display: inline;
    	transition: .2s ease-in-out;
}
*/
.content-section-brochure
.brochure-article
{
      width: 100%;
      height: 10vh;     
      text-align: center;
      background-color: #f3f1ee;
}
.content-section-brochure
h5
{      
      font-size: 18px;
      color: #242424;
      font-weight: 700;      
      font-family: "Inter", sans-serif;
}
.content-section-brochure
p
{      
      font-size: 13px;
      color: #242424;
      font-weight: 500;      
      font-family: "Work Sans", sans-serif;
}
.content-section-brochure
.brochure-button
{
      width: 100%;
      height: 18vh;
      display: flex;
      align-items: center;
      justify-content: center;      
      background-color: #f3f1ee;
}
.content-section-brochure
ul
{	  
	display: flex;
      margin-top: -100px;	  	        
}
.content-section-brochure
li
{	  	      	  
      margin: 2px;
	width: 150px;
	height: 60px;	  
	display: flex;           
      align-items: center;      
	border-radius: 30px; 	  
	justify-content: center; 	  
	background-color: #f2aa4c;

	transition: all 0.25s ease-out;
}
.content-section-brochure
li:hover
{	    	    
	opacity: 0.8;
      cursor: pointer;
	transition: all 0.25s ease-out;
}
.content-section-brochure
.button-path
{	  
	padding: 10px;   	        
	font-size: 15px;	    
      color: #242424;	  
	font-weight: 700;
}
.content-section-brochure
.brochure-button
svg
{
      width: 20px;
      height: auto;
      fill: #242424;
}
.content-section-brochure
i
{	  	  
      color: #222;	  
      font-size: 12px;  	  	    
      transform: rotate(90deg);	    
}




.content-section-banner
{
      width: 100%; 
      height: auto;
      margin: 0 auto;          
      font-family: "Figtree", sans-serif;
}
.content-section-banner
.banner-container
{      
      width: 100%;     
      height: 60vh;                    
      margin: 0 auto;
      position: relative;      
      background-color: #f3f1ee;
}
.content-section-banner
.banner-article
{	 
	width: 14%;            
      height: 12vh;              
      display: flex;
      margin: 0 auto;          
      align-items: center;      
}
.content-section-banner
.article-a
{          
      padding: 6px;         
      font-size: 18px;
      font-weight: 700;      
      color: #4c4c4c;         
}
.content-section-banner
.article-b
{     
      padding: 6px;         
      font-size: 18px;
      color: #0a5c36;
      font-weight: 700;            
}
.content-section-banner
img 
{
      width: 100%;
      max-width: 100%;
      max-height: 50vh;           
      background-size: contain;  
      background-repeat: no-repeat;
      background-position: center center;
}
.content-section-banner
.banner-heading
{      
      top: 60%;
      left: 50%;
      position: absolute;
      border-radius: 30px;
      transform: translate(-50%, -50%);
}
.content-section-banner
h6
{           
      padding: 30px;
      font-size: 40px;
      color: #f2aa4c;
      font-weight: 700;
      
      text-transform: uppercase;
      
      backdrop-filter: blur(2px);
      -webkit-backdrop-filter: blur(2px);
      background-color: rgba(#e6daca, 0.9);
}