* {margin:0; padding:0}
body {
  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}

#wrapper {width:1112px;  }
#container {position:relative; background:#fff;  height:425px; border-right:1px solid #fff; border-bottom:1px solid #fff;}
.sliderbutton {float:left; width:42px; height:41px; cursor:pointer}
#slideleft {background:url(img/main/left.png) no-repeat;  position:absolute; top:220px; left:0px;  z-index:9999;}
#slideleft:hover {background:url(img/main/left.png) no-repeat; border:1px solid green;}
#slideright {background:url(img/main/right.png) no-repeat; position:absolute; right:0; top:220px; z-index:9999; }
#slideright:hover {background:url(img/main/right.png) no-repeat;}
#slider {float:left; position:relative; overflow:auto; width:1112px; height:425px}
#slider ul {position:absolute; list-style:none; top:0; left:0}
#slider li {float:left; width:1112px; height:425px}
.pagination {position:absolute; bottom:20px; right:0px; list-style:none; height:20px}
.pagination li {float:left; cursor:pointer; height:40px; width:360px;  margin:0 2px 0 0;  border:1px solid rgba(255, 255, 255, 0.01);}
.pagination li:hover, li.current { border:1px solid rgba(255, 255, 255, 0.01);}

.visual {
  position: relative;
}
.visual .inner {
  width: 1100px;
  margin: 0 auto;
  position: relative;
}

/* -99 제거: 자연스러운 레이어 유지 */
.visual .visual_slide {
  position: relative;
  z-index: 1;
}
.visual .visual_slide .swiper-wrapper,
.visual .visual_thumb .swiper-wrapper{height: auto !important;}

/* 썸네일 영역을 위로 올리고 오버플로우 개방 */
.visual .visual_thumb {
  position: relative;
  z-index: 10;
  width: 100%;
  border: 1px solid #ddd;
  border-top: none;
  overflow: visible;
}
.visual_thumb .swiper-wrapper {
  overflow: visible;
}
.visual_thumb .swiper-slide {
  cursor: pointer;
  padding: 15px 0;
  border-right: 1px solid #ddd;
  color: #333;
  position: relative;
  background: #fff;
  transition: background 0.3s, color 0.3s;
}
.visual_thumb .swiper-slide:last-child {
  border-right: none;
}

/* 활성 표시용 화살표 */
.visual_thumb .swiper-slide .arrow {
  position: absolute;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  top: -6px; /* 크기(12px)에 맞춰 노출 높이 조정 */
  width: 12px;
  height: 12px;
  background: #aaa;
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none;
}

.visual_thumb .swiper-slide p {  
  font-weight: 400;
  font-size: 17px;
  text-align: center;
  margin: 0;
}

/* 활성화 상태 */
.visual_thumb .swiper-slide-thumb-active {
  background: #aaa;
}
.visual_thumb .swiper-slide-thumb-active p {
  color: #fff;
  font-weight: 700;
}
.visual_thumb .swiper-slide-thumb-active .arrow {
  opacity: 1;
}