/*session用メインビジュアル*/
@charset "UTF-8";


/* .page-header .page-title-area .page-title .en {
  font-size: var(--font-lg);
  font-weight: 500;
}
.page-header .page-title-area .page-title .ja {
  font-size: var(--font-md);
} */


/* ページヘッダー部 */
/*メンバー用、カテゴリー別ページ*/

.page-header{
  width:100%;
  height:20rem;
  margin-top:5rem;
  position:relative;
  box-shadow: 2px 2px 1px var(--black);
  background-color: pink;
}

.page-header .img{
  width:100%;
  height:100%;
  background-image:url(../img/mainvisual/mainvisual4.webp);
  background-size: cover;
  background-attachment: fixed;
  background-position: bottom;
} 

.page-header .page-title-area {
  position:absolute;
  top:0px;
  left:0;
  background-color:var(--black);
  opacity:0.5;
  width:30%;
  height:100%;
  padding:1rem;
  display: flex;
  align-items: center;
}

.page-header .page-title-area .page-title .en{
  display: block;
  font-size:var(--font-lg);
  font-weight: 600;
  color:var(--white);
  letter-spacing: 0.05em;
}

.page-header .page-title-area .page-title .ja{
  display: block;
  font-size:var(--font-md);
  color:var(--white);
}

/*-------------------------------------------
スマートフォン
-------------------------------------------*/
@media screen and (max-width: 767px) {


.page-header{
  height:15rem;
}


.page-header .page-title-area {
  width:fit-content;
  height:fit-content;
  top: auto;
  bottom: 5%;
  /* padding:0.8rem; */
  /* display:flex;
   align-items: center;
   justify-content: center; */
}

.page-header .page-title-area .page-title .en{
  font-size:var(--font-md);
  display:none;
}

.page-header .page-title-area .page-title .ja{
  font-size:var(--font-sm);
  width:100%;
  text-align:center;

}

}