@charset "utf-8";

.main_visual .mv_ttl {
 text-shadow: 0 0 2px rgba(0, 0, 0, 0.9),
 0 0 4px rgba(0, 0, 0, 0.9),
 0 0 8px rgba(0, 0, 0, 0.9),
 0 0 10px rgba(0, 0, 0, 0.9),
 0 0 12px rgba(0, 0, 0, 0.9),
 0 0 14px rgba(0, 0, 0, 0.9);
}

.main_visual .lens_img {
	width: 22%;
}

.photo_container .movie {
 position: relative;
 padding-top: 56.25%;
}
.photo_container .movie_ttl {
 margin: 0 0 2%;
 font-size: 1.4vw;
}
.photo_container .movie iframe {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
}

#lens p.lens_name {
 margin-bottom: 1%;
}
#lens .new {
 display: inline-block;
 margin-bottom: 1.5%;
 color: #fff;
 background-color: #d50000;
 padding: 7px 12px;
 border-radius: 4px;
 font-size: 1.85vw;
 font-weight: 300;
 line-height: 1;
}

#portraitmovie{
 background-color: #f9f9fa;
}
#portraitmovie h2.fz_jp {
 font-size: 3vw;
}
#portraitmovie .interview_mov,
#portraitmovie .profile{
 width: 68%;
 height: auto;
 margin: 0 auto;
}
#portraitmovie .movie{
 width: 100%;
	padding: 56.25% 0 0;
 position: relative;
}
#portraitmovie .movie iframe{
 display: block;
 width: 100%;
 height: 100%;
 position: absolute;
 left: 0;
 top: 0;
}
#portraitmovie .profile{
 display: flex;
 justify-content: space-between;
 padding: 4% 0;
}
#portraitmovie .profile .prof_data{
 flex: 1;
 text-align: left;
 display: flex;
 flex-direction: column;
}
#portraitmovie .profile .prof_data p.prof_status,
#portraitmovie .profile .prof_data p.prof_name span,
#portraitmovie .profile .prof_data p.prof_note{
 font-size: 1.06vw;
 font-weight: 300;
}
#portraitmovie .profile .prof_data p.prof_name{
 font-size: 2.8vw;
 font-weight: 350;
 margin-bottom: auto;
}

/*--------- Animation ---------*/
#portraitmovie .interview_mov,
#portraitmovie .profile .prof_data p,
#portraitmovie .profile .prof_data .notes{
 opacity: 0;
}
#portraitmovie .interview_mov.active{
 animation: fadeIn 0.4s ease-in 0.2s;
 animation-fill-mode: both;
}
#portraitmovie .profile .prof_data.active p.prof_status{
 animation: fadeIn 0.4s ease-in 0s;
 animation-fill-mode: both;
}
#portraitmovie .profile .prof_data.active p.prof_name{
 animation: fadeIn 0.4s ease-in 0.5s;
 animation-fill-mode: both;
}
#portraitmovie .profile .prof_data.active p.prof_note{
 animation: fadeIn 0.4s ease-in 0.8s;
 animation-fill-mode: both;
}
#portraitmovie .profile .prof_data.active .notes{
 animation: fadeIn 0.4s ease-in 0.9s;
 animation-fill-mode: both;
}

@media only screen and (max-width: 760px) {
 .lead_block {
  padding-top: 22%;
 }
 #lens .lens_img {
  margin-bottom: 6%;
 }

 .main_visual .lens_img {
  width: 45%;
 }

 .photo_container .movie_ttl {
  font-size: 3.6vw;
 }

 #lens .new {
  padding: 4px 5px;
  border-radius: 2px;
  font-weight: 300;
  font-size: 3.6vw;
 }

 #portraitmovie h2.fz_jp {
  padding: 0 5%;
  font-size: 7vw;
 }
 #portraitmovie .interview_mov{
  width: 100%;
 }
 #portraitmovie .profile{
  flex-direction: column;
  width: 90%;
  margin: 0 auto;
  padding: 5% 0 10%;
 }
 #portraitmovie .profile .prof_data {
  flex: 0 0 100%;
 }
 #portraitmovie .profile .prof_data p.prof_status{
  font-size: 3.5vw;
 }
 #portraitmovie .profile .prof_data p.prof_status,
 #portraitmovie .profile .prof_data p.prof_name{
  text-align: center;
 }
 #portraitmovie .profile .prof_data p.prof_name{
  font-size: 5.8vw;
  text-align: center;
  margin-bottom: 5%;
 }
 #portraitmovie .profile .prof_data p.prof_name span{
  display: block;
 }
 #portraitmovie .profile .prof_data p.prof_name span{
  font-size: 3.8vw;
 }
 #portraitmovie .profile .prof_data p.prof_note{
  font-size: 3.6vw;
 }
}