@media (max-width: 768px) {
}
/* CSS Reset 추가 */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html, body {
  width: 100%;
  /* height: 100%; */
  overflow-x: hidden; /* 가로 스크롤 방지 */
}

:root{
  --gray-white : #fff;
  --primary-800: #005250;
  --primary-700: #006A67;
  --primary-600: #008884;
  --primary-500: #009591;
  --primary-400 : #33AAA7;
  --primary-300 : #54B8B5;
  --primary-200 : #8ACECC;
  --primary-100 : #B0DEDD;
  --primary-50 : #F5FBFA;

  --gray-800   : #25282B;
  --gray-700   : #4D5053;
  --gray-600   : #4D5053;
  --gray-500   : #75787B;
  --gray-400   : #9DA0A3;
  --gray-300   : #C5C8CB;
  --gray-200   : #EDF0F3;
  --gray-100   : #F7FAFD;
  --primary-gradient: linear-gradient(270deg, #276351 0%, #00866B 50%, #276351 100%);
}

.primary500{
  color: var(--primary-500);
}

@media (max-width: 768px) {
  body{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
}
/* 타이포 그라피 글씨체 모음 */
@font-face {
    font-family: 'Hana2-Bold';
    src: url('/1QLab/static/fonts/typography/Hana2-Bold.otf');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Hana2-CM';
    src: url('/1QLab/static/fonts/typography/Hana2-CM.otf');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Hana2-Heavy';
    src: url('/1QLab/static/fonts/typography/Hana2-Heavy.otf');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Hana2-Light';
    src: url('/1QLab/static/fonts/typography/Hana2-Light.otf');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Hana2-Medium';
    src: url('/1QLab/static/fonts/typography/Hana2-Medium.otf');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Hana2-Regular';
    src: url('/1QLab/static/fonts/typography/Hana2-Regular.otf');
    font-weight: normal;
    font-style: normal;
}
/* 타이포 그라피 글씨체 모음 끝*/

/* Pretendard  글꼴 모음*/

@font-face {
    font-family: 'Pretendard';
    src: url('/1QLab/static/fonts/pretendard/Pretendard-Regular.otf') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    /* Cross-Origin 사용을 위한 설정 */
    cross-origin: anonymous;
  }
  @font-face {
    font-family: 'Pretendard-SemiBold';
    src: url('/1QLab/static/fonts/pretendard/Pretendard-SemiBold.otf') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    /* Cross-Origin 사용을 위한 설정 */
    cross-origin: anonymous;
  }
  @font-face {
    font-family: 'Pretendard-ExtraBold';
    src: url('/1QLab/static/fonts/pretendard/Pretendard-ExtraBold.otf') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    /* Cross-Origin 사용을 위한 설정 */
    cross-origin: anonymous;
  }
  
  @font-face {
    font-family: 'Pretendard-Black';
    src: url('/1QLab/static/fonts/pretendard/Pretendard-Black.otf') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    /* Cross-Origin 사용을 위한 설정 */
    cross-origin: anonymous;
  }
  @font-face {
    font-family: 'Pretendard-Bold';
    src: url('/1QLab/static/fonts/pretendard/Pretendard-Bold.otf') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    /* Cross-Origin 사용을 위한 설정 */
    cross-origin: anonymous;
  }
  @font-face {
    font-family: 'Pretendard-Light';
    src: url('/1QLab/static/fonts/pretendard/Pretendard-Light.otf') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    /* Cross-Origin 사용을 위한 설정 */
    cross-origin: anonymous;
  }
  @font-face {
    font-family: 'Pretendard-Thin';
    src: url('/1QLab/static/fonts/pretendard/Pretendard-Thin.otf') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    /* Cross-Origin 사용을 위한 설정 */
    cross-origin: anonymous;
  }
  @font-face {
    font-family: 'Pretendard-Medium';
    src: url('/1QLab/static/fonts/pretendard/Pretendard-Medium.otf') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    /* Cross-Origin 사용을 위한 설정 */
    cross-origin: anonymous;
  }
  @font-face {
    font-family: 'Pretendard-ExtraLight';
    src: url('/1QLab/static/fonts/pretendard/Pretendard-ExtraLight.otf') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    /* Cross-Origin 사용을 위한 설정 */
    cross-origin: anonymous;
  }
/* Pretendard  글꼴 모음 끝*/

/* 타이포그래피 폰트 클래스 */
.hana2-bold{
    font-family: 'Hana2-Bold', sans-serif;
  }
  
  .hana2-cm {
    font-family: 'Hana2-CM', sans-serif;
  }
  
  .hana2-heavy {
    font-family: 'Hana2-Heavy', sans-serif;
  }
  
  .hana2-light {
    font-family: 'Hana2-Light', sans-serif;
  }
  
  .hana2-medium {
    font-family: 'Hana2-Medium', sans-serif;
  }
  
  .hana2-regular {
    font-family: 'Hana2-Regular', sans-serif;
  }
  
  /* Pretendard 폰트 클래스 */
  .pretendard-regular {
    font-family: 'Pretendard', sans-serif ;
  }
  
  .pretendard-semibold {
    font-family: 'Pretendard-SemiBold', sans-serif;
  }
  
  .pretendard-extrabold {
    font-family: 'Pretendard-ExtraBold', sans-serif;
  }
  
  .pretendard-black {
    font-family: 'Pretendard-Black', sans-serif;
  }
  
  .pretendard-bold {
    font-family: 'Pretendard-Bold', sans-serif;
  }
  
  .pretendard-light {
    font-family: 'Pretendard-Light', sans-serif;
  }
  
  .pretendard-thin {
    font-family: 'Pretendard-Thin', sans-serif;
  }
  
  .pretendard-medium {
    font-family: 'Pretendard-Medium', sans-serif;
  }
  
  .pretendard-extralight {
    font-family: 'Pretendard-ExtraLight', sans-serif;
  }


/* 하나 CI 컬러 */
.bg-hanaColor {
    background-color: #009591;
}
/* Contact us  버튼 칼라*/
.hanaContactColor{
    background-color: #008884;
}
.headlineXs{
  font-size: 16px !important;
  line-height: 22px !important;
}
/* @media (min-width: 768px) { */
  .headlineS{
    font-size: 1.125rem !important;
    line-height: 1.75rem !important;
    /* font-size: 18px;
    line-height: 28px ; */
  }
  .headlineM{
      font-size: 24px ;
      line-height: 36px ;
      
  }
  .headlineL{
      font-size : 32px !important;
      line-height: 48px !important;
  }

  .titleS{
      font-size: 14px ;
      line-height: 20px ;
      
  }
  .titleM{
      font-size: 18px ;
      line-height: 24px ;
  }
  .titleL{
      font-size: 22px ;
      line-height: 32px ;
  }

  .bodyXS{
      font-size: 12px ;
      line-height: 20px ;
  }
  .bodyS{
    font-size : 14px;
    line-height: 24px;
  } 
  .bodyM{
      font-size: 16px ;
      line-height: 28px ;
  }
  .bodyL{
      font-size: 18px ;
      line-height: 32px ;
  }

  .labelS{
      font-size: 12px ;
      line-height: 16px ;
  }
  .labelM{
      font-size: 14px ;
      line-height: 20px ;
  }
  .labelL{
      font-size: 16px ;
      line-height: 24px ;
  }

.gray{
    color: #75787B;
}

.section1_t_container{
  width: 1200px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 40px;
}
body, section{
  background-color: white;
  color : black;
}

@media (max-width:1200px) {
  .section1_t_container{
    width: 100%;
  }
}


@media (min-width:768px){
  .mobile-only{
    display: none !important;
  }
  .tablet_folded_only{
    display: none !important;
  }
}

.no-scroll {
  user-select: none !important;
  overflow: hidden;
  height: 100vh; /* 모바일 터치 스크롤 방지 */
}

#header.loading {
  min-height: 80px; /* 기존 헤더 높이에 맞게 설정 */
  background: #276351; /* 임시 배경 */
  width: 100vw;
  height: 504px;
}

#body.loading{
  opacity: 0;
}

.loadingbar{
    display:none;
    gap: 4px !important;
    color : var(--gray-400);
    padding : 32px;
} 
.loadingbar.on { display: flex !important;}
.loadingbar img {
    animation: rotate360 1s forwards infinite;
}
@media (min-width:768px) {
  .loadingbar{
    display: none !important;
  }
}