.enneagram-test-wrapper {
  max-width: 680px;
  margin: 0 auto;
  font-family: 'Noto Sans KR', sans-serif;
}

.progress-bar {
  background-color: #e0e0e0;
  height: 10px;
  border-radius: 5px;
  margin-bottom: 20px;
  overflow: hidden;
}

.progress {
  background-color: #007bff; /* 파란색으로 변경 */
  height: 100%;
  transition: width 0.3s;
}

.enneagram-navigation {
  text-align: right; /* 중앙 정렬로 변경 */
  margin-bottom: 20px;
  font-size: 17px;
}

.enneagram-question p {
  font-size: 24px; /* 질문 크기 키움 */
  margin: 40px 0; /* 질문 위아래로 여백 추가 */
  text-align: center;
  font-weight: 600;
  color: #34495e;
}

.radio-group2 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30px;
}

.radio-option2 {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.radio-option2 input[type='radio'] {
  appearance: none;
  border: 2px solid;
  border-radius: 50%;
  outline: none;
  cursor: pointer;
  transition: all 0.3s ease;
  margin-bottom: 10px;
  position: relative;
}

/* 스타일링 수정: 크기 및 색상 적용 */
.radio-option2:nth-child(1) input[type='radio'] {
  width: 70px;
  height: 70px;
  border: 2px solid #88619a;
  color: #88619a;
}

.radio-option2:nth-child(2) input[type='radio'] {
  width: 50px;
  height: 50px;
  border: 2px solid #88619a;
  color: #88619a;
}

.radio-option2:nth-child(3) input[type='radio'] {
  width: 35px;
  height: 35px;
  border: 2px solid #919294;
  color: #919294;
}

.radio-option2:nth-child(4) input[type='radio'] {
  width: 50px;
  height: 50px;
  border: 2px solid #33a474;
  color: #33a474;
}

.radio-option2:nth-child(5) input[type='radio'] {
  width: 70px;
  height: 70px;
  border: 2px solid #33a474;
  color: #33a474;
}

.radio-option2 input[type='radio']:checked,
.radio-option2 input[type='radio']:hover {
  background-color: currentColor;
}

.radio-option2 input[type='radio']:checked::before,
.radio-option2 input[type='radio']:hover::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: currentColor;
  border-radius: 50%;
  transform: translate(0, 0);
}

.radio-option2 label {
  font-size: 14px;
  color: #34495e;
  text-align: center;
  cursor: pointer;
}

.radio-option2:first-child label,
.radio-option2:last-child label {
  display: block;
  font-weight: bold;
}

.question-fade-out {
  animation: fadeOut 0.1s ease-out forwards;
}

.question-fade-in {
  animation: fadeIn 0.1s ease-in forwards;
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.start-button-wrapper {
  text-align: center;
  margin-top: 50px;
}

.start-button {
  cursor: pointer;
  transition: transform 0.3s ease;
}

.start-button:hover {
  transform: scale(1.05);
}