@charset "utf-8";
/* Type Selector:HTML 요소의 초기화를 선언 */

:root {
    --bg-tab: #25467b;
    --bg-box: #10213f;
    --bg-body: linear-gradient(120deg, #162f58, #10213f);
    --bg-dark: rgba(19, 23, 34, 1);
    --bg-basic: #10213f;
    --bg-light: #3d4b63;
    --bg-active: #008b74;
    --bd-basic: #ffffff33;
    --bd-light: #ffffff19;
    --bd-dark: #363a45;
    --bd-button: #d2dbfa;
    --btn-light: #f2f5ff;
    --btn-color: #5473e8;
    --bg-short : #f1583f;
    --bg-long : #1da2b4;
    --cl-basic: #ffffffe6;
    --cl-light: #ffffff80;
    --ht-head : 25px;
}



@font-face {
    font-family: 'LINESeedKR-Bd';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_11-01@1.0/LINESeedKR-Bd.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

* { margin:0; padding:0; font-family:inherit; font-size:inherit; color:inherit; line-height:inherit; box-sizing:border-box; word-break:keep-all} /* 전체 태그에 대하여 마진, 패딩, 서체크기, 서체종류 초기화 */

img {border:none}
button {cursor: pointer}
ul,ol,li { list-style:none; }

em,address {font-style:normal} 

a:link {text-decoration:none; border:none}
a:hover, a:active, a:visited {text-decoration:none}

legend, caption {position:absolute; top:0; left:0; width:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0}

textarea {overflow:auto} 

table {border-collapse: collapse; border-spacing:0}

input[type='radio'] {
  -webkit-appearance: none; 
  -moz-appearance: none; 
  appearance: none; 
  width: 18px;
  height: 18px;
  border: 2px solid #ccc;
  border-radius: 50%;
  outline: none; 
  cursor: pointer;
}

input[type='radio']:checked {
  background-color: #22d3ee; 
  border: 3px solid white; 
  box-shadow: 0 0 0 1.6px #22d3ee; 
}


/* 전체 스크롤바 스타일 */
::-webkit-scrollbar {
    width: 14px;  /* 스크롤바의 너비 */
}

/* 스크롤바 트랙 스타일 */
::-webkit-scrollbar-track {
    background: #0f1e3a;  /* 트랙 배경색, 배경색보다 약간 더 어둡게 설정 */
    border-radius: 10px;  /* 둥근 모서리 */
}

/* 스크롤바 핸들 스타일 */
::-webkit-scrollbar-thumb {
    background-color: #1e3a70;  /* 핸들 색상, 배경색보다 밝게 설정 */
    border-radius: 10px;  /* 둥근 모서리 */
    border: 3px solid #0f1e3a;  /* 트랙 배경색과 동일한 색상으로 보더를 설정하여 핸들이 분리된 것처럼 보이도록 함 */
}

/* 스크롤바 핸들 호버 스타일 */
::-webkit-scrollbar-thumb:hover {
    background-color: #2954a3;  /* 핸들 호버 색상, 호버 시 더 밝은 색으로 변경 */
}