@charset "UTF-8";

/*--------------------------------------------------------------
header
--------------------------------------------------------------*/
header{
  background-color: #000;
  height: calc(60vw + 13.5rem);
  margin: 0 0 2rem 0;
}
  
  
  
/*--------------------------------------------------------------
breadcrumb
--------------------------------------------------------------*/
.breadcrumb{
  top: 10rem;
  padding: 0 1.5rem;
}

.breadcrumb__inner{
  max-width: none;
  width: 100%;
  display: flex;
  align-items: center;
  margin: 0 auto;
}

.breadcrumb__inner li{
font-size: 1rem;
}


/*--------------------------------------------------------------
main-mv
--------------------------------------------------------------*/
.main-mv{
  position: relative;
  /*top: 0;*/
  top: 15rem;
}

.mv-tit{
  position: relative;
  top: 0;
  left: 1.5rem;
  width: calc(100% - 3rem - 3rem);
}

  .mv-tit__bg {
  }

.mv-img{
  top:-3rem;
  right: 1.5rem;
  width: calc(100% - 3rem - 3rem);
}
.mv-img__bg {
}


/*--------------------------------------------------------------
mv-tit__inner
--------------------------------------------------------------*/
.mv-tit__inner{
  position: static;
  width: auto;
  aspect-ratio: auto;
  margin: 0 1.5rem 0;
  padding: 0;
}

.mv-tit__vol{
  font-size: 2.1rem;
  margin: 0 0 1rem 0;
}

.mv-tit__title{
  font-size: 2.1rem;
  font-weight: bold;
  margin: 0 0 1.5rem 0;
}
.mv-tit__date{
  display: block;
  font-size: 1.2rem;
  text-align: right;
}



/*--------------------------------------------------------------
article-content
--------------------------------------------------------------*/
.article-content{
  border-top: 1px solid #f7f7f7;
  padding: 4rem 0 4rem;
  margin: 4rem 1.5rem 0;}

.article-content .content__body img {
  max-width:none;
  width: 100%;
}

.article-content .content__body iframe{
  width: 100%;
}

/*--------------------------------------------------------------
other
--------------------------------------------------------------*/
.other{
  padding: 25vw 1.5rem 12rem;
  background-position: 0 -10rem,0 bottom;
}

.other__title{
  font-size: 2.1rem;
  margin: 0 0 4rem 0;
}

.other .list{
  display: flex;
  gap:normal;
  row-gap: 3rem;
}

.other .list__item{
  width: 100%;
}

.other .list__item a{
  display: flex;
}


.other .list__item figure{
  width: calc(40% - 1.5rem);
  margin: 0 1.5rem 0 0;
}

.other .item__vol{
  font-size: 2.1rem;
  font-weight: normal;
}

.other .item__title{
  width: 60%;
  font-size: 1.4rem;
}

.other .btn__inner{
  margin: 4rem 0 0 0;
  padding: 6rem 0 0 0;
  border-top: 1px solid #333;
}

.other .btn__inner ul{
  width: auto;
  margin: 0 auto 4rem;
}

.other a.btn-prev,
.other a.btn-next{
  font-size: 1.4rem;
}