@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Black+Han+Sans:400');
@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Light.woff') format('woff');
    font-weight: 300;
    font-display: swap;
}

@import url('//fonts.googleapis.com/earlyaccess/notosanskr.css');


body {
  margin: 0;
  padding: 0;
  font-family: 'Pretendard', sans-serif;
}

/* 제목 섹션 */
.price-title {
  text-align: center;
  margin-bottom: 50px;
}

.price-title h2 {
  font-size: 130px;            /* 크게 */
  font-weight: 700;
  color: #f0f0f0; 
  letter-spacing: 1.5px;
  margin-bottom: 12px;
}

/* 구분선 */
.price-title .line {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100vw - 17px);   /* 스크롤바 두께만큼 보정 */
  height: 3px;
  background-color: #66ff33;
  margin: 0;
  border: none;
  border-radius: 0;
}

h3 {
  font-size:100px;
  text-align: left;
  width: 75%;
  margin-bottom: .5%;
}


.vat {
  list-style: none;
  text-align: left;
  color:#66ff33;
  width: 75%;
  margin-top: 1%;
}

.vat01 {
  list-style: none;
  text-align: left;
  color:#66ff33;
  width: 75%;
  margin-top: 0 ato;
  margin-bottom: .5%;
}

/* 일반 페이지용 이미지 */
.price-gallery img {
  width: 75%;
  display: block;
  margin: 40px auto; /* 위아래 여백도 추가 */
  cursor: pointer;
  transition: 0.3s;
}

.price-gallery .item03 {
  margin-bottom: 80px;
}


/* 표 이미지 영역
.price-table {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 60px 0 120px 0;
}

.price-table img {
  width: 90%;
  max-width: 1000px;
  border: 1px solid #ddd;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}
*/




/* 모달 기본 스타일 */
.modal {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.9);
  overflow: hidden;
}

/* 모달 이미지 */
.modal-content {
  display: block;
  width: auto;
  height: 100vh;          /* 화면 세로 전체 꽉 채움 */
  max-width: 100vw;        /* 가로는 화면보다 안 넘게 */
  object-fit: contain;     /* 비율 유지하면서 꽉 차게 */
  margin: 0 auto;
  position: absolute;
  top: 50%;               /* 화면 세로 중앙 기준 */
  left: 50%;              /* 화면 가로 중앙 기준 */
  transform: translate(-50%, -50%);
  border-radius: 10px;
  box-shadow: 0 0 20px rgba(0,0,0,0.7);
  transition: all 0.3s ease;
}


/* 닫기 버튼 */
.modal-close {
  position: absolute;
  top: 20px;
  right: 40px;
  color: white;
  font-size: 60px;
  cursor: pointer;
  transition: 0.3s;
  z-index: 1001;
}

.modal-close:hover {
  color: #ccc;
}

/* 좌우 화살표 */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: 80px;              /* 화살표 버튼 크기 키우기 */
  height: 80px;             /* 화살표 버튼 크기 키우기 */
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 40px;
  transition: 0.3s;
  user-select: none;
  transform: translateY(-50%);
  z-index: 1001;


  /* 클릭 영역 확장 */
 /* 배경색을 반투명하게 추가 */
  border-radius: 50%;               /* 원형으로 버튼을 만들어 클릭 영역 확대 */
}

.prev:hover, .next:hover {
  color: #66ff33;
}

.prev { left: 30px; }
.next { right: 30px; }





/*모바일*/


@media screen and (max-width: 768px) {
 .price-title h2 {
  font-size: 60px; 
  font-weight: 700;
  color: #f0f0f0; 
  letter-spacing: 1.5px;
  margin-bottom: 12px;
  margin-top:130px;
}

.modal {
  position: relative;
}


/* 일반 페이지용 이미지 */
.price-gallery img {
  width: 90%;
}

.price-gallery img.item03 {
  margin-bottom: 60px;
}

}