@charset "utf-8";
/* CSS Document */
/* デフォルトは非表示 */
#pagination { display: none !important; }
#pagination:has(li) { display: flex !important; }
#pagination:empty { display: none !important; }

.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  list-style-type: none;
  padding: 40px;
  margin: 40px 0;
  gap: 5px;
  background: #ffffff;
  border-radius: 50px;
}

.pagination a {
  display: inline-block;
  text-decoration: none;
  border: 1px solid #DCDCDC;
  color: #333;
  transition: all 0.3s ease;
  font-size: 1.25rem;
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.pagination a:hover {
  background-color: #1A4DA5;
  color: white;
  border-color: #1A4DA5;
}

.pagination .active a {
  background-color: #1A4DA5;
  color: white;
  border-color: #1A4DA5;
}

.pagination .disabled a {
  color: #aaa;
  pointer-events: none;
}

.pagination .arrow a {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid #DCDCDC;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.3s ease;
}

.pagination .arrow a:hover {
  background-color: #1A4DA5;
  border-color: #1A4DA5;
}

.pagination .left-single a {
  width: 40px; 
  height: 40px;
  background: url("../images/left_single.svg") no-repeat center center;
  background-size: 17px 17px; 
  transition: background-color 0.3s ease; 
}

.pagination .left-single a:hover {
  background: url("../images/left_single_hover.svg") no-repeat center center;
  background-size:  17px 17px;  
  background-color: #1A4DA5;
}
.pagination .right-single a {
  width: 40px; 
  height: 40px;
  background: url("../images/right_single.svg") no-repeat center center;
  background-size: 17px 17px;  
  transition: background-color 0.3s ease; 
}
.pagination .right-single a:hover {
  background: url("../images/right_single_hover.svg") no-repeat center center;
  background-size: 17px 17px; 
  background-color: #1A4DA5;
}

.pagination .left-double a {
  width: 40px; 
  height: 40px;
  background: url("../images/left_double.svg") no-repeat center center;
  background-size: 17px 17px; 
  transition: background-color 0.3s ease;
}
.pagination .left-double a:hover {
  background: url("../images/left_double_hover.svg") no-repeat center center;
  background-size: 17px 17px; 
  background-color: #1A4DA5;
}

.pagination .right-double a {
  width: 40px; 
  height: 40px;
  background: url("../images/right_double.svg") no-repeat center center;
  background-size: 17px 17px; 
  transition: background-color 0.3s ease;
}
.pagination .right-double a:hover {
  background: url("../images/right_double_hover.svg") no-repeat center center;
  background-size: 17px 17px; 
  background-color: #1A4DA5;
}
.pagination .hidden {
  display: none;
}
	
@media(max-width:1024px){
.pagination {
	margin-top: 70px;	
}
}