html{
  scroll-behavior: smooth;
  margin:0 auto;
  width:100%;
  height:100%;
  font-size: 62.5%;
  word-break: keep-all;
  background: #000B43; /* fallback color */
  background: -webkit-linear-gradient(top, #000B43 0%, #00051F 100%);
  background: -moz-linear-gradient(top, #000B43 0%, #00051F 100%);
  background: -o-linear-gradient(top, #000B43 0%, #00051F 100%);
  background: linear-gradient(to bottom, #000B43 0%, #00051F 100%);


}
body{
	color:#979797;
  width:100%;
  height:100%;
	line-height: 1.4;
  font-size:1.6rem;
  font-weight: 300;
  font-family: 'Inter', sans-serif;
  overflow: hidden;
  font-size: 62.5%;
  margin: 0 auto;
  transform: translateZ(0);
  
}

/* 애니메이션을 재시작하기 위한 클래스 */
.gauge-reset {
    animation: none !important;
}

/* 드래그 영역*/
::selection{
  color: #fff;
  background: #171675;
}

/*블루 버튼 공통 애니메이션 */
.blue-animation-color {background: linear-gradient(230deg, #006dbb, #00518C, #45b1ff, #00518C); background: -moz-linear-gradient(230deg, #006dbb, #00518C, #45b1ff, #00518C); background: -webkit-linear-gradient(230deg, #006dbb, #00518C, #45b1ff, #00518C);  background: linear-gradient(230deg, #006dbb, #00518C, #45b1ff, #00518C);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006dbb', endColorstr='#00684d',GradientType=1 ); background-size: 600% 600%;-webkit-animation: playani 5s ease infinite;  -moz-animation: playani 5s ease infinite; -o-animation: playani 5s ease infinite; animation: playani 5s ease infinite;
color:#fff;}

@-webkit-keyframes playani {
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
@-moz-keyframes playani {
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
@-o-keyframes playani {
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
@keyframes playani {
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}


/*폰트 사이즈 선언*/
.ft-10 { font-size: 1rem; }
.ft-11 { font-size: 1.1rem; }
.ft-12 { font-size: 1.2rem; }
.ft-13 { font-size: 1.3rem; }
.ft-14 { font-size: 1.4rem; }
.ft-15 { font-size: 1.5rem; }
.ft-16 { font-size: 1.6rem; }
.ft-17 { font-size: 1.7rem; }
.ft-18 { font-size: 1.8rem; }
.ft-19 { font-size: 1.9rem; }
.ft-20 { font-size: 2rem; }
.ft-21 { font-size: 2.1rem; }
.ft-22 { font-size: 2.2rem; }
.ft-23 { font-size: 2.3rem; }
.ft-24 { font-size: 2.4rem; }
.ft-25 { font-size: 2.5rem; }
.ft-26 { font-size: 2.6rem; }
.ft-27 { font-size: 2.7rem; }
.ft-28 { font-size: 2.8rem; }
.ft-29 { font-size: 2.9rem; }
.ft-30 { font-size: 3rem; }
.ft-31 { font-size: 3.1rem; }
.ft-32 { font-size: 3.2rem; }
.ft-33 { font-size: 3.3rem; }
.ft-34 { font-size: 3.4rem; }
.ft-35 { font-size: 3.5rem; }
.ft-36 { font-size: 3.6rem; }
.ft-37 { font-size: 3.7rem; }
.ft-38 { font-size: 3.8rem; }
.ft-39 { font-size: 3.9rem; }
.ft-40 { font-size: 4rem; }
.ft-41 { font-size: 4.1rem; }
.ft-42 { font-size: 4.2rem; }
.ft-43 { font-size: 4.3rem; }
.ft-44 { font-size: 4.4rem; }
.ft-45 { font-size: 4.5rem; }
.ft-46 { font-size: 4.6rem; }
.ft-47 { font-size: 4.7rem; }
.ft-48 { font-size: 4.8rem; }
.ft-49 { font-size: 4.9rem; }
.ft-50 { font-size: 5rem; }
.ft-51 { font-size: 5.1rem; }
.ft-52 { font-size: 5.2rem; }
.ft-53 { font-size: 5.3rem; }
.ft-54 { font-size: 5.4rem; }
.ft-55 { font-size: 5.5rem; }
.ft-56 { font-size: 5.6rem; }
.ft-57 { font-size: 5.7rem; }
.ft-58 { font-size: 5.8rem; }
.ft-59 { font-size: 5.9rem; }
.ft-60 { font-size: 6rem; }
.ft-61 { font-size: 6.1rem; }
.ft-62 { font-size: 6.2rem; }
.ft-63 { font-size: 6.3rem; }
.ft-64 { font-size: 6.4rem; }
.ft-65 { font-size: 6.5rem; }
.ft-66 { font-size: 6.6rem; }
.ft-67 { font-size: 6.7rem; }
.ft-68 { font-size: 6.8rem; }
.ft-69 { font-size: 6.9rem; }
.ft-70 { font-size: 7rem; }
.ft-71 { font-size: 7.1rem; }
.ft-72 { font-size: 7.2rem; }
.ft-73 { font-size: 7.3rem; }
.ft-74 { font-size: 7.4rem; }
.ft-75 { font-size: 7.5rem; }
.ft-76 { font-size: 7.6rem; }
.ft-77 { font-size: 7.7rem; }
.ft-78 { font-size: 7.8rem; }
.ft-79 { font-size: 7.9rem; }
.ft-80 { font-size: 8rem; }
.ft-81 { font-size: 8.1rem; }
.ft-82 { font-size: 8.2rem; }
.ft-83 { font-size: 8.3rem; }
.ft-84 { font-size: 8.4rem; }
.ft-85 { font-size: 8.5rem; }
.ft-86 { font-size: 8.6rem; }
.ft-87 { font-size: 8.7rem; }
.ft-88 { font-size: 8.8rem; }
.ft-89 { font-size: 8.9rem; }
.ft-90 { font-size: 9rem; }
.ft-91 { font-size: 9.1rem; }
.ft-92 { font-size: 9.2rem; }
.ft-93 { font-size: 9.3rem; }
.ft-94 { font-size: 9.4rem; }
.ft-95 { font-size: 9.5rem; }
.ft-96 { font-size: 9.6rem; }
.ft-97 { font-size: 9.7rem; }
.ft-98 { font-size: 9.8rem; }
.ft-99 { font-size: 9.9rem; }
.ft-100 { font-size: 10rem; }

.white {color:#fff;}
.right-blue {color:#0081CC;}
.bold {font-weight: bold;}
.fw-300 {font-weight: 300;}
h2 {line-height:100%;}
p {color:#979797;}


.flex {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; width: 100%; height: auto;}
.flex-start {justify-content: flex-start; align-items: stretch;}
.flex-end {justify-content: flex-end; align-items: stretch;}
.stretch {align-items: stretch;}
.space-between {justify-content: space-between;}
.align-start {align-items: flex-start;}

/* 1등분 (전체 폭) */
.flex-1ea .content { flex: 0 0 100%; max-width: 100%;}
.flex-2ea .content { flex: 0 0 calc((100% - (2rem * 1)) / 2);max-width: calc((100% - (2rem * 1)) / 2);}
.flex-3ea .content { flex: 0 0 calc((100% - (2rem * 2)) / 3);max-width: calc((100% - (2rem * 2)) / 3);}
.flex-4ea .content { flex: 0 0 calc((100% - (2rem * 3)) / 4);max-width: calc((100% - (2rem * 3)) / 4);}
.flex-5ea .content { flex: 0 0 calc((100% - (2rem * 4)) / 5); max-width: calc((100% - (2rem * 4)) / 5);}
.flex-6ea .content {flex: 0 0 calc((100% - (2rem * 5)) / 6);max-width: calc((100% - (2rem * 5)) / 6);}
.flex-7ea .content { flex: 0 0 calc((100% - (2rem * 6)) / 7); max-width: calc((100% - (2rem * 6)) / 7);}
.content {overflow: hidden;}

.mb-10 {margin-bottom: 1rem;}
.mb-20 {margin-bottom: 2rem;}
.mb-30 {margin-bottom: 3rem;}
.mb-40 {margin-bottom: 4rem;}
.pd-10 {padding:1rem;}
.pd-20 {padding:2rem;}
.br-15 {border-radius: 1.5rem; overflow: hidden;}
.gray {color:#979797;}
a {color:#979797;}
a:hover {text-decoration: underline;}

.t-center {text-align: center;}
.l-center {text-align: left;}
.t-right{text-align: right;}
.img-100 {width: 100%; object-fit: cover;}

.glass {overflow: hidden; border-radius: 1.5rem; bottom:0; z-index: 1; background-color: rgba(255,255,255,0.1); backdrop-filter: blur(10px);   -webkit-backdrop-filter: blur(10px);  -webkit-backdrop-filter: blur(10px);  /* Safari 지원용 */   box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);}
.glass::before {content: "";
  position: absolute;
  inset: 0;
  padding: 1px; /* 테두리 두께 */
  background: linear-gradient(135deg, rgba(255,255,255,0.1), rgba(255,255,255,0.01));
  mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0);
  -webkit-mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0);
  mask-composite: exclude;
  -webkit-mask-composite: destination-out;
  pointer-events: none;}

  h1,h2,h3,h4,h5,h6 {line-height: 1.2;}


ul.pure-ul {
  list-style-type: disc;        /* 원형 불릿 */
  list-style-position: outside;/* 텍스트 바깥에 불릿 */
  margin-left: 2em;          /* 들여쓰기 조정 (필요시 수정) */
  padding-left: 0;             /* reset된 경우에 맞춰 조정 */
}