@charset "UTF-8";
/* CSS Document */
#LinkTrailer, #LinkIntro, #LinkStory, #LinkCast {
/*margin-top: -70px;
padding-top: 70px;*/
}
@media (max-width:768px){
	#LinkTrailer, #LinkIntro, #LinkStory, #LinkCast {
margin-top: 0;
padding-top: 0;
}
}

/* 黒オーバーレイ */
#transitionOverlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000;
	opacity: 0;
	pointer-events: none;
	z-index: 9999;
	transition: opacity 0.5s ease;
}

/* 表示状態 */
#transitionOverlay.is-active {
	opacity: 1;
	pointer-events: auto;
}
/* =========================
  HEADER（PC固定）
========================= */
.nav{
position: fixed;
  top:0;
  left:0;
  width:100%;
  height:60px;
 background:rgba(0,0,0,0.8);
  z-index:1000;
  margin:auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:0 1.5em;
font-family: "Anton", sans-serif;
  font-weight: 400;
  font-style: normal;
	font-size: clamp(14px, 1.5625vw, 20px);
	letter-spacing: 0.1em;
		color: rgba(255,255,255,0.4);
	backdrop-filter: blur(10px);
}

.nav-menu a {
	color: rgba(255,255,255,0.8);
}

/* LOGO */
.logo{
width: 20%;
	max-width: 250px;
}

/* =========================
  PC MENU
========================= */
.nav-menu{
  display:flex;
  list-style:none;
}

.nav-menu li{
  margin-left:1em;
}

.nav-menu a{
  color:#fff;
  text-decoration:none;
  transition:0.3s;
}

.nav-menu a:hover{
  opacity:0.6;
}

/* =========================
  ハンバーガー
========================= */
.hamburger{
  display:none;
  width:30px;
  cursor:pointer;
}

.bar{
  height:3px;
  width:100%;
  background:#fff;
  margin:5px 0;
  transition:0.3s;
}

/* =========================
  MOBILE
========================= */
@media (max-width:768px){
.logo{
width: 40%;
max-width: 250px;
}

  /* ハンバーガー表示 */
  .hamburger{
    display:block;
  }

  /* PCメニュー隠す */
  .nav-menu{
    position:fixed;
    top:60px;
/*	  top:0;*/
	  padding-top: 2em;
    right:-100%;
    width:100%;
    height:calc(100vh - 60px);
    background:rgba(0,0,0,1);
    flex-direction:column;
    align-items:center;
/*    justify-content:center;*/
    transition:0.3s;
  }

  .nav-menu li{
    margin:0.5em 0;
	  font-size: 20px;
	  
  }

  /* 開いた状態 */
  .nav-menu.active{
    right:0;
  }

  /* ハンバーガー → X */
  .hamburger.active .bar:nth-child(1){
    transform:rotate(45deg) translateY(8px);
  }

  .hamburger.active .bar:nth-child(2){
    opacity:0;
  }

  .hamburger.active .bar:nth-child(3){
    transform:rotate(-45deg) translateY(-8px);
  }
}
