/* ---- 메인 콘텐츠 레이아웃 ---- */
.main-con01 {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  min-height: 100vh;
}

.c-content02 {
  width: 100%;
  background-color: #fff;
  padding: 0 20px;
  min-height: 800px;
  border-radius: 8px; /* 둥근 테두리 */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* 부드러운 그림자 */
}

.title-box {
	text-align: center;
}

/* 기본 스타일 */
.pt-serchbox {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #fff; /* 배경 색상 */
}

/* 검색창 스타일 */
.search-box {
  display: flex;
  align-items: center;
  border: 2px solid #8F5C0E;
  border-radius: 50px; /* 둥근 모서리 */
  padding: 14px 28px;
  background: linear-gradient(145deg, #ffffff, #fff); /* 그라디언트 배경 */
  margin-left: 48px;
  margin-bottom: 14px;
}

/* 검색 입력창 스타일 */
.search-box input[type="text"] {
  border: none;
  outline: none;
  font-size: 16px;
  padding: 18px 20px;
  border-radius: 30px; /* 더 부드럽고 커다란 둥근 모서리 */
  width: 500px;
  background-color: #fff;
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.2); /* 입력창 아래에 그림자 */
  transition: box-shadow 0.3s ease-in-out; /* 그림자 애니메이션 */
}

.search-box input[type="text"]:focus {
  box-shadow: 0px 0px 10px rgba(143, 92, 14, 0.6); /* 포커스 시 강조 효과 */
}

/* 검색 버튼 스타일 */
.search-box input[type="button"] {
  background-color: #8F5C0E; /* 포인트 색상 */
  color: #fff;
  border: none;
  border-radius: 30px; /* 둥근 모서리 */
  padding: 16px 28px;
  font-size: 16px;
  cursor: pointer;
  margin-left: 26px;
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1); /* 버튼 그림자 */
  transition: all 0.3s ease; /* 부드러운 애니메이션 */
}

.search-box input[type="button"]:hover {
  background-color: #704206;
  transform: translateY(2px); /* hover 시 버튼이 위로 올라가는 효과 */
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); /* hover 시 그림자 효과 강화 */
}

.search-box input[type="button"]:active {
  background-color: #5d3501;
  transform: translateY(1px); /* 클릭 시 버튼이 아래로 눌리는 효과 */
  box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3); /* 클릭 시 그림자 강하게 */
}

.popup {
	display:none; 
	position:fixed; 
	top:0; 
	left:0; 
	width:100%; 
	height:100%; 
	background:rgba(0, 0, 0, 0.5);
}

.popup-content {
	background:white; 
	padding:20px; 
	margin:100px auto; 
	width:50%; 
	min-width:800px;
}

.close-popup {
	position: relative;
    top: -7px;
    right: -926px;
    border: none;
    cursor: pointer;
}

.detail-container {
	display: flex;
}
.detail{
	padding : 23px;
	font-size: 18px;
	border: 1px solid #cfc8c8;
}
.detail-img{
	display: flex;
	align-items: center;
}

.pop-img {
	margin-left: 48px;
    width: 420px;
    padding: 30px;
}


/* 기본 레이아웃 */
.detail-box {
    margin: 20px auto;
    padding: 20px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border: 1px solid #ddd;
}

/* 제목 스타일 */
.invention-title {
    font-size: 24px;
    font-weight: bold;
    color: #8F5C0E;  /* 포인트 컬러 */
    margin-bottom: 15px;
}

/* 내용 스타일 */
.detail p {
    font-size: 16px;
    line-height: 1.5;
    color: #333;
    margin-bottom: 10px;
}

/* 강조 텍스트 (강조된 항목들) */
.detail p strong {
    color: #8F5C0E;  /* 포인트 컬러 */
    font-weight: 600;
}

/* 구분선 */
.detail p:not(:last-child) {
    border-bottom: 1px solid #cfc8c8;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

/* 마우스를 올렸을 때 버튼 애니메이션 */
.detail p:hover {
    background-color: #f9f9f9;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

  /* 테이블 스타일 */
    .search-itembox {
      width: 100%;
      margin: 20px auto;
      border-collapse: collapse;
      background-color: #fff;
      box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    }
    
    /* 제목 셀 스타일 */
    .search-itembox  {
      padding: 15px;
      text-align: center;
      vertical-align: middle;
      font-size: 18px;
      font-weight: bold;
    }

    .search-ititle {
      background-color: #d5d5d5;
      color: #3f3e3e;
      border-right: 1px solid #fff; /* 제목 구분선 */
    }
    
    .search-ino01 {
      background-color: #d5d5d5;
      color: #3f3e3e;
      border-left: 1px solid #fff; /* 제목 구분선 */
    }
    
    /* 데이터 셀 스타일 */
    .search-ibox02 {
      border-top: 1px solid #eee;
      transition: background-color 0.3s ease;
    }

    .search-ibox02:hover {
      background-color: #f1f1f1;
    }

    .search-iclick {
      color: #333;
      font-size: 16px;
      font-weight: bold;
      cursor: pointer;
      transition: color 0.3s ease;
      text-align: center;
      border-bottom: 1px solid #d5d5d5;
    }

    .search-iclick .search-p:hover {
      color: #c79d5c;
    }

    .search-ino02 {
      font-size: 15px;
      color: #717171;
      text-align: center;
      border-bottom: 1px solid #d5d5d5;
    }
    
    .paging-box {
    	display: flex;
    	justify-content: center;
    	gap: 1px;
    	margin-bottom: 70px;
    	margin-top: 14px;
    }
    
    .pgbtn_active {
    	display: flex;  /* inline-block으로 바꿔서 정렬이 가능하도록 함 */
    	justify-content: center;
   	 	margin: 0 5px;  /* 좌우 여백을 주어 간격을 만들 수 있음 */
   	 	padding-top: 3px;
   	 	width: 24px;
   	 	height: 24px;
   	 	cursor: pointer;
    }
    
    .pgbtn_active:hover {
    	color: #007bff;
    	text-decoration: underline;
    }
    
    .pg_btn {
    	display: flex;  /* inline-block으로 바꿔서 정렬이 가능하도록 함 */
    	justify-content: center;
   	 	margin: 0 5px;  /* 좌우 여백을 주어 간격을 만들 수 있음 */
   	 	padding-top: 3px;
   	 	width: 24px;
   	 	height: 24px;
   	 	cursor: pointer;
    }
    
    .pg_btn:hover {
    	color: #007bff;
    	text-decoration: underline;
    }
    
    .pgmove_prev {
    	cursor: pointer;
    }
    
    .pgmove_prev:hover {
    	color: #007bff;
    	transform: translateX(-3px);  /* 5px 오른쪽으로 이동 */
    }
    
    .pgmove_next {
    	cursor: pointer;
    }
    
     .pgmove_next:hover {
     	color: #007bff;
    	transform: translateX(3px);  /* 5px 오른쪽으로 이동 */
    }
    
    /* 게시판 컨테이너 스타일 */
	.board-container {
	   display: none;
	   width: 68%;              /* 게시판 전체 너비 설정 */
	   margin: 40px auto;       /* 화면 중앙 정렬 */
	   padding: 20px;
	   border: 1px solid #ddd;  /* 테두리 */
	   border-radius: 8px;      /* 모서리 둥글게 */
	   background-color: #f9f9f9; /* 배경색 */
	   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); /* 그림자 효과 */
	}
	
	
	/* 테이블 스타일 */
	.search-itembox {
	    width: 100%;
	    border-collapse: collapse;  /* 테이블 셀 경계선 합침 */
	}
	
	.search-itembox th,
	.search-itembox td {
	    padding: 12px 20px;      /* 셀 내 여백 */
	   text-align: left;         /* 텍스트 왼쪽 정렬 */
	   border-bottom: 1px solid #ddd;  /* 각 행의 구분선 */
	}
	
	/* 제목 셀 스타일 */
	.search-ititle {
	    font-size: 16px;
	    font-weight: bold;
	    color: #333;
	}
	
	/* 출원 번호 셀 스타일 */
	.search-ino01 {
	    font-size: 16px;
	    color: #333;
	}
	
	/* 행 hover 효과 */
	.search-ibox02:hover {
	    background-color: #f1faff; /* 호버 시 배경색 변경 */
	}
	
	/* 클릭 가능한 텍스트 스타일 */
	.search-p {
	    font-size: 14px;
	    color: #007bff;
	    cursor: pointer;
	    transition: color 0.3s ease;
	}
	
	/* 클릭 시 텍스트 색상 변경 */
	.search-p:hover {
	    color: #0056b3;
	    text-decoration: underline;  /* 마우스 올리면 밑줄 */
	}
	
	/* 각 행의 스타일 */
	.search-ibox02 {
	    background-color: #fff;
	}
	
	/* 각 셀에 경계선 추가 */
	.search-iclick {
	    border-right: 1px solid #ddd;
	}
	
	/* 마지막 셀은 오른쪽 경계선 제거 */
	.search-ino02 {
	    border-right: none;
	}