@charset "UTF-8";
@font-face {
    font-family: 'Noto Sans Thin';
    font-style: normal;
    src: local("Noto Sans Thin"), local("NotoSans-Thin"), url(fonts/NotoSansKR-Thin.eot), url(fonts/NotoSansKR-Thin.eot?#iefix) format("embedded-opentype"), url(fonts/NotoSansKR-Thin.woff) format("woff"), url(fonts/NotoSansKR-Thin.otf) format("opentype");
}

@font-face {
    font-family: 'Noto Sans Light';
    font-style: normal;
    src: local("Noto Sans Light"), local("NotoSans-Light"), url(fonts/NotoSansKR-Light.eot), url(fonts/NotoSansKR-Light.eot?#iefix) format("embedded-opentype"), url(fonts/NotoSansKR-Light.woff) format("woff"), url(fonts/NotoSansKR-Light.otf) format("opentype");
}

@font-face {
    font-family: 'Noto Sans DemiLight';
    font-style: normal;
    font-weight: 400;
    src: local("Noto Sans DemiLight"), local("NotoSans-DemiLight"), url(fonts/NotoSansKR-DemiLight.eot), url(fonts/NotoSansKR-DemiLight.eot?#iefix) format("embedded-opentype"), url(fonts/NotoSansKR-DemiLight.woff) format("woff"), url(fonts/NotoSansKR-DemiLight.otf) format("opentype");
}

@font-face {
    font-family: 'Noto Sans Regular';
    font-style: normal;
    font-weight: 500;
    src: local("Noto Sans Regular"), local("NotoSans-Regular"), url(fonts/NotoSansKR-Regular.eot), url(fonts/NotoSansKR-Regular.eot?#iefix) format("embedded-opentype"), url(fonts/NotoSansKR-Regular.woff) format("woff"), url(fonts/NotoSansKR-Regular.otf) format("opentype");
}

@font-face {
    font-family: 'Noto Sans Medium';
    font-style: normal;
    font-weight: 700;
    src: local("Noto Sans Medium"), local("NotoSans-Medium"), url(fonts/NotoSansKR-Medium.eot), url(fonts/NotoSansKR-Medium.eot?#iefix) format("embedded-opentype"), url(fonts/NotoSansKR-Medium.woff) format("woff"), url(fonts/NotoSansKR-Medium.otf) format("opentype");
}

@font-face {
    font-family: 'Noto Sans Bold';
    font-style: normal;
    font-weight: 800;
    src: local("Noto Sans Bold"), local("NotoSans-Bold"), url(fonts/NotoSansKR-Bold.eot), url(fonts/NotoSansKR-Bold.eot?#iefix) format("embedded-opentype"), url(fonts/NotoSansKR-Bold.woff) format("woff"), url(fonts/NotoSansKR-Bold.otf) format("opentype");
}

@font-face {
    font-family: 'Malgun Gothic Bold';
    font-style: normal;
    font-weight: 800;
    src: local("Malgun Gothic Bold"), local("MalgunGothicBold"), url(fonts/MalgunGothicBold.eot), url(fonts/MalgunGothicBold.eot?#iefix) format("embedded-opentype"), url(fonts/MalgunGothicBold.woff) format("woff"), url(fonts/MalgunGothicBold.otf) format("opentype");
}


* {
	box-sizing: border-box; /* 오페라(Opera) */
	-moz-box-sizing: border-box; /* 파이어폭스(Firefox)*/
	-webkit-box-sizing: border-box; /* 웹킷(Webkit) & 크롬(Chrome) */
	font-family:'Noto Sans Regular';
	font-size: 16px;
}

@media screen and (min-width: 1367px) { /*1367이상인 경우*/
	* {
		font-size: 18px;
	}
}

@media screen and (max-width: 1366px) { /*1366이하인 경우*/
}

html {
	/* Prevent font scaling in landscape */
	-webkit-text-size-adjust: none; /*Chrome, Safari, newer versions of Opera*/
	-moz-text-size-adjust: none; /*Firefox*/
	-ms-text-size-adjust: none;  /*Ie*/
	-o-text-size-adjust: none; /*old versions of Opera*/
}

/* html5 reset add */
html, body, div, span, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {margin: 0; padding: 0; border: 0; outline: 0;font-family: 'Noto Sans Regular';}
a{margin: 0; padding: 0;} 

/* default css */
html, body {width:100%;height:100%;margin:0;padding:0;/*display:flex;flex-direction:column;*/}
h1, h2, h3, h4, h5, h6 {text-align:left;font-weight:normal;margin:0; padding:0; border:0; font-smoothing:antialiased; -webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
table {table-layout:fixed; margin:0; padding:0; border:0; border-collapse:collapse;}
td, th {empty-cells:show;}
form, img, fieldset, legend, input, select, textarea, div, p, dl, dt, dd, ul, ol, li, fieldset, blockquote, th, td, iframe {margin:0;padding:0;border:0;}
ul, ol, li {list-style:none;}
a:link, a:visited {text-decoration:none;}
a:hover, a:active {text-decoration:none;}
em, address {font-style:normal;}
textarea {overflow:auto;}
hr, legend, caption, .hide {position:absolute; top:0; left:0; width:0; height:0; overflow:hidden; font-size:0; line-height:0; margin-left:-55555px;}For Screen Reader
caption, th {text-align:left;}
td {vertical-align:middle;}
img {vertical-align:top;}
input {resize: none;}
textarea {resize: none;}

.hidden {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    clip: rect(0, 0, 0, 0);
}

.srr-topbar{
    width:100vw;
    height:5px;
    background-image: url(/img/h_bar.png);
    background-repeat: no-repeat;
	background-size: cover;
}

.srr-title{
  color:#ff9000;font-size:1.8rem;font-weight:bold;letter-spacing:0px;
}

/* tctap.css - TCTAP2025 커스텀 테마 */
[data-bs-theme="tctap"] {
  /* 배경 & 기본 텍스트 */
  --bs-body-bg: #0b1f4a;
  --bs-body-color: #ffffff;
  --bs-secondary-bg: #0b1f4a; 
  --bs-box-shadow-sm: #ffffff;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);

  /* 색상 팔레트 */
  --bs-primary: #0d6efd;
  --bs-secondary: #6c757d;
  --bs-success: #198754;
  --bs-info: #0dcaf0;
  --bs-warning: #ffc107;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;

  /* 링크 */
  --bs-link-color: #f89c1c;
  --bs-link-hover-color: #f89c1c;

  /* 카드 */
  --bs-card-bg: #ffffff;
  --bs-card-color: #000000;
  --bs-border-radius: 0.5rem;

  /* 타이포그래피 */
  --bs-heading-color: #ffffff;
  --bs-font-sans-serif: 'Segoe UI', sans-serif;

  .card {
    --bs-card-border-color: rgb(151 183 117 / 50%) !important;
  }
}

/* 카드 헤더 색상 */
.card-header.tctap-green {
  background-color: #66bb6a;
  color: #ffffff;
}

.card-header.tctap-purple {
  background-color: #ab47bc;
  color: #ffffff;
}

.card-header.tctap-orange {
  background-color: #ef6c00;
  color: #ffffff;
}

.card-header.tctap-blue {
  background-color: #42a5f5;
  color: #ffffff;
}

.card-header.tctap-teal {
  background-color: #26a69a;
  color: #ffffff;
}

/* 텍스트 유틸리티 확장 */
.text-primary {
    color: var(--bs-primary) !important;
  }
  
  .text-success {
    color: var(--bs-success) !important;
  }
  
  .text-warning {
    color: var(--bs-warning) !important;
  }
  
  .text-info {
    color: var(--bs-info) !important;
  }
  
  .text-danger {
    color: var(--bs-danger) !important;
  }
  

/* 오렌지 포인트 텍스트 */
.text-orange {
  color: #f89c1c;
}

/* NEXT 텍스트 강조 */
.tctap-next-label {
  color: #f89c1c;
  font-weight: bold;
  letter-spacing: 0.5px;
}

/* 배경 어둡게, 흰 텍스트 기본 */
body[data-bs-theme="tctap"] {
  background-color: #0b1f4a;
  color: #ffffff;
}

.list-container {
	display: flex;
	gap: 20px;
	list-style: none;
	padding: 0;
	justify-content: center;
}
.list-item-wrapper {
	display: flex;
	flex-direction: column;
	align-items: flex-start; /* 왼쪽 정렬 */
	text-align: left; /* 왼쪽 정렬 */
	width: 50px;
	position: relative;
}

.list-item-wrapper.active {
	width:30%;
}
.list-item {
	font-size: 12px;
	cursor: pointer;
	transition: color 0.3s ease;
	padding-bottom: 5px;
}
.list-item::after {
	content: "";
	position: absolute;
	left: 0;
	/*bottom: -5px;*/
	width: 100%;
	height: 2px;
	background-color: var(--bs-border-color);
	display: block;
	transition: width 0.3s ease, background-color 0.3s ease;
}
.list-item-wrapper.active .list-item {
	color: var(--bs-primary);
	font-weight: bold;
}
.list-item-wrapper.active .list-item::after {
	width:100%;
	background-color: var(--bs-primary);
}
.description {
	display: none;
	font-size: 16px;
	color: var(--bs-primary);
	font-weight: bold;
	margin-top: 8px;
	text-align: left; /* 설명도 왼쪽 정렬 */
	width: max-content; /* 설명 길이에 맞게 조정 */
}
.list-item-wrapper.active .description {
	display: block;
}