@charset "UTF-8";
/* CSS Document */

/* .responsive-box{
	width: 100%;
	aspect-ratio: 48 / 25;
} 
*/
.anchor-target {
  scroll-margin-top: 90px; /* 固定ヘッダーの高さに応じて調整 */
}

.levelbox dt{
	font-size: 18px;
	font-weight: 900;
	color:#161932;
	border-bottom:5px solid #571e9c
}

#semina-voice .levelbox dt{
	font-size: 18px;
	font-weight: 900;
	color:#161932;
	border-bottom:5px solid #7b3191
}
#semina-voice .levelbox dd:not(:last-of-type){
border-bottom:1px solid #be4ae0;
}
.levelbox dd{
	font-size: 15px;
	font-weight: normal;
	color: #333;
	padding: 1em;
	line-height: 1.75
}
.levelbox dd:not(:last-of-type){
border-bottom:1px solid #A25EF4;
}
.levelbox{
	background-color: #fff;
	border-radius: 6px;
	padding: 1.5em 2em;
	margin-bottom: 2em
}
.stage_ttl{
  margin: initial;
  padding: initial;
	font-size: 24px;
	font-weight: 900;
	text-align: center;
	color:#161932;
	display: flex;
	align-items: center;
  border: none!important;
}
.stage_ttl_center{
  margin: initial;
  padding: initial;
	font-size: 24px;
	font-weight: 900;
	text-align: center;
	color:#161932;
  border: none!important;
}
.stage_ttlRoma{
	font-size: 29px;
	font-weight: 900;
}

.stage_ttlsub{
	font-size: 16px;
	font-weight: 900;
}

.stage_block{
	margin-bottom: 4em
}

/*　ボタン　*/
.category_nav_wrap {
max-width: 700px;
margin:0 auto 3em
 }
.category_nav {
 display: flex;
 flex-wrap: wrap;
   justify-content: center;
   justify-content: flex-start;
 margin-bottom: initial;
}

.category_nav li {
 margin-right: 50px;
 margin-bottom: 30px;
 margin-right: initial;
list-style-type: none
}
.category_nav li a {
 color: #A25EF4;
 font-size: 15px;
 text-align: center;
 font-weight: 800;
 border-radius: 20px;
 border: 1px solid #A25EF4;
 background-color: #fff;
 min-width: 200px;
 height: 40px;
 line-height: 40px;
 display: block;
 box-sizing: border-box;
 transition: all 0.3s;
}
.category_nav li a:hover {
 color: #fff;
 background-color: #A25EF4;
 border: 1px solid #A25EF4;
 text-decoration: none
}

.category_nav li:not(:nth-of-type(4n)) {
  margin-right: 0;
 }
.category_nav li:not(:nth-of-type(3n)) {
  margin-right: 50px;
 }

@media screen and (max-width: 1024px) {
.category_nav_wrap {
  max-width: 700px;
 }
.category_nav {
  justify-content: flex-start;
 }
.category_nav li:not(:nth-of-type(4n)) {
  margin-right: 0;
 }
.category_nav li:not(:nth-of-type(3n)) {
  margin-right: 50px;
 }
}
@media screen and (max-width: 800px) {
.category_nav {
  display: flex;
  justify-content: space-between;
 }
.category_nav li {
  width: calc(50% - 15px / 2);
 }
.category_nav li:not(:nth-of-type(3n)) {
  margin-right: 0;
 }
.category_nav li:not(:nth-of-type(2n)) {
  margin-right: 0
 }

}
@media screen and (max-width: 599px) {
.category_nav {
  flex-direction: row !important;
 }
.category_nav li a {
  min-width: 180px !important;
 }
.pagination_v2 li {
  width: calc(50% - 15px / 2)
 }
}
@media screen and (max-width: 414px) {
.category_nav li a {
  color: #A25EF4;
  font-size: 13px;
  height: 40px;
  line-height: 40px;
  min-width: 100px !important
 }
}
#voicePage .gallery {
  max-width: 800px;        /* ギャラリー全体の最大幅 */
  margin: 0 auto;          /* 中央寄せ */
  display: grid;
  grid-template-columns: repeat(5, 1fr); /* 5列固定 */
  gap: 10px;               /* カラム間の隙間 */
  padding: 20px;
}

#voicePage .gallery img {
  width: 100%;             /* カラム幅いっぱい */
  height: auto;            /* アスペクト比維持 */
  border-radius: 6px;
  cursor: pointer;
  transition: transform 0.2s;
  display: block;
}

#voicePage .gallery img:hover {
  transform: scale(1.05);
}
@media screen and (max-width: 600px) {
#voicePage .gallery {
    grid-template-columns: repeat(3, 1fr); /* スマホは3列 */
  }
}

/* === ライトボックス === */
#voicePage #lightbox {
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999;
}

#voicePage #lightbox.hidden {
  display: none;
}

#voicePage #lightbox-img-wrapper {
  position: relative;
  display: inline-block;
}

#voicePage #lightbox-img {
  max-width: 90vw;
  max-height: 90vh;
  border-radius: 8px;
  display: block;
}

#voicePage #close {
  position: absolute;
  top: -10px;
  right: -10px;
  font-size: 1.8rem;
  color: white;
  background: rgba(0, 0, 0, 0.7);
  border-radius: 50%;
  padding: 6px 12px;
  cursor: pointer;
  user-select: none;
  line-height: 1;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

#voicePage #close:hover {
  background: rgba(255, 255, 255, 0.2);
}

