.showcase-img {
  background-image: url(/images/susumu_showcase.png) ;
  background-position: center ;
  background-size: cover;
  object-fit: cover;
  height:800px;
}
.showcaseTitle{
  padding-top: 100px;
}
.introClass{
  text-align: center;
}
.introTitle{
  display: inline-block;
  border-bottom: 5px solid #cf2a2d;
  margin: 0 auto;
}
.myintroPhoto{
  border-radius: 10px;
}
.introMyTitle{
  font-size: 1.4em;
}
.introDescription{
  text-align: left; 
}
.socialMediaSection{
  min-height: 150px;
  background-color: #cf2a2d;
  padding-bottom: 30px;
}
.socialFollow{
  font-size: 1.8em;
  color:#FFF;
  font-weight: bold;
  padding-top: 30px;
}

.follow-me-twitter,.follow-me-instagram,.follow-me-facebook,.follow-me-youtube,.follow-me-github,.follow-me-tiktok{
  color:#FFF;
  font-size: 3em;
  margin-right: 20px;
}
.follow-me-twitter:hover,.follow-me-instagram:hover,.follow-me-facebook:hover,.follow-me-youtube:hover,.follow-me-github:hover{
  color:rgb(204, 204, 204);
}



.footer-twitter,.footer-instagram,.footer-facebook,.footer-youtube,.footer-github{
  color:rgb(204, 204, 204);
  font-size: 2em;
  margin-right: 25px;
}

.footer-twitter:hover,.footer-instagram:hover,.footer-facebook:hover,.footer-youtube:hover,.footer-github:hover{
  color:#cf2a2d;
}

.movieTitle,.cameraTitle{
  font-size: 0.8em;
  padding-left: 15px;
}
.workTitle{
  padding-bottom: 30px;
  text-align: center;
  font-size: 2.0em;
}


.bi-camera-reels,.bi-caret-right-square,.bi-camera,.bi-card-image{
  color:#cf2a2d;
}
.movieWrap{
  padding:40px 30px 80px ;
  background-image: url("/images/movie_bg.jpg");
  background-position: center; 
}

.photoWrap{
  padding:40px 30px 80px ;
  background-image: url("/images/photo_bg.jpg");
  background-position: center; 
}
.contactWrap{
padding: 60px 0px 80px;
background-color: #F4F4F4;
}

.contactTitle{
  font-size: 2.4em;
  margin-bottom: 30px;
}
.guestCreatorsWrap{
  background-color: #cf2a2d;
  padding: 30px 0px;
  color: #FFF;
}
.guestTitle{ 
  font-size: 1.8em;
}
.webAdjust{
  height: 150px;
}
.socialWrapFooter{
  margin-bottom: 30px;
}
.introVideoWrap{
  margin: 150px 0px 0px;
  background-color: #444444;
  padding: 60px 0px 60px;
}
.myVideoTitle{
  font-size: 2em;
  padding-bottom: 20px;
  color:#FFF;
  text-align: center;
}
.recentWorks{
  padding:100px 0px 45px;
}
.recentThumbnails{
  padding-bottom:100px;
}

.retouched{
  padding-bottom:100px;
}
.webWrap{
  color:#FFF;
  padding:80px 30px 80px ;
  background-image: url("/images/web_bg.jpg");
  background-position: center;
}

.recentWorksTitle{
  font-size: 1.4em;
  padding-bottom: 10px;
}
.video360_title{
  font-size: 1.4em;
  padding-bottom: 10px;
}

/* 動画を囲うdiv */
.video {
  position: relative;
  width:100%; /* 横幅は100%にしておく(ここを変えたい場合は実装コード2の方法を確認してください) */
  height:0; /* 高さは0にしておく(padding-topで高さを指定するため) */
  padding-top: 56.25%; /* 高さを指定(16:9) */
}

/* YouTube埋め込み用のiframe */
.video iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.emailBlock{
  display: inline-block;
  border-bottom: 3px solid #cf2a2d;
  margin: 0 auto;
  font-size: 1.2em;
}

/* ********* Media Query ********* */

/* // X-Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
  
 }

/* // Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) { 
  .showcase-img{
    height: 600px;
  }
  .showcaseTitle{
    padding-top: 100px;
  }
  .webAdjust{
    height: auto;
  }
 
  
 }

/* // Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) { 
  
 }

/* // Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) { 

 }

/* // X-Large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) { 

 }