/* 한국 지도를 표시하기 위한 CSS */

@font-face {
  font-family: 'KoreaMapFontV1';
  src: url('https://guidance-web-rails.s3.ap-northeast-2.amazonaws.com/fonts/korea-map-font-v1.eot'),
       url('https://guidance-web-rails.s3.ap-northeast-2.amazonaws.com/fonts/korea-map-font-v1.eot?#iefix') format('embedded-opentype'),
       url('https://guidance-web-rails.s3.ap-northeast-2.amazonaws.com/fonts/korea-map-font-v1.woff') format('woff'),
       url('https://guidance-web-rails.s3.ap-northeast-2.amazonaws.com/fonts/korea-map-font-v1.ttf') format('truetype'),
       url('https://guidance-web-rails.s3.ap-northeast-2.amazonaws.com/fonts/korea-map-font-v1.svg#koreamapfontv1regular') format('svg');
  font-weight: normal;
  font-style: normal;
}

.korea-map-font-v1 {
  /* 폰트 설정 */
  font: normal normal 300px/100% "KoreaMapFontV1";
  font-size-adjust: none;

  /* 텍스트 렌더링 품질 (자간, 합자 등 최적화) */
  text-rendering: optimizeLegibility;

  /* 합자(Ligature) 설정 - 최신 브라우저 표준 */
  font-feature-settings: "liga", "dlig";

  /* 레이아웃 설정 */
  overflow: hidden;
  width: 300px;
  display: block;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

.korea-map-font-v1 li {
  /* 레이아웃 및 위치 설정 (기존 로직 유지) */
  float: left;
  width: 100%;
  position: relative;
  left: 101%;
  margin: -20% 0 0 -100%; /* 요소를 겹치게 만드는 핵심 기법 */

  /* 마우스 커서 */
  cursor: default;

  /* 애니메이션 (표준 속성 추가됨) */
  -webkit-transition: all 1s ease-in;
  transition: all 1s ease-in;

  /* 모바일 터치 및 텍스트 선택 방지 */
  -webkit-touch-callout: none; /* iOS 사파리 꾹 누름 메뉴 방지 */
  -webkit-user-select: none;   /* 크롬, 사파리 */
  -moz-user-select: none;      /* 파이어폭스 */
  -ms-user-select: none;       /* IE 10, 11 */
  user-select: none;           /* 표준 */
}
