@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700;800&family=Noto+Sans+JP:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700;800&display=swap');

/*==================================

 Layout

==================================*/
.teaser-block{
  padding-bottom: 8%;
}
#fightsong .teaser-block-title{
  background-image: url(../images/fightsong/tit_fightsong.png);
  padding-top: 13.4%;
  margin-bottom: 6%;
}
#fightsong .teaser-block-lead{
  text-align: center;
  margin-bottom: 6%;
}
#fightsong .teaser-block-lead p{
  display: inline;
  font-size: 2rem;
  text-align: center;
  background: #102d69;
  color: #fff;
}
#fightsong .teaser-fightsong-img figure{
  display: block;
  background-image: url(../images/fightsong/img_misia.jpg);
  width: 100%;
  padding-top: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
#fightsong .teaser-fightsong-img .fightsong-name{
  display: block;
  background-image: url(../images/fightsong/name_misia.png);
  width: 100%;
  height: 0;
  padding-top: 9.2%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  margin-top: 6.3%;
}
#fightsong .teaser-fightsong-img .fightsong-name span{
  display: none;
}
#fightsong .teaser-fightsong-about{
  position: relative;
  margin: 6.3% 0 10%;
  z-index: 1;
}
#fightsong .teaser-fightsong-about p{
  position: relative;
  text-align: justify;
}
#fightsong .teaser-fightsong-about::before{
  content: '';
  display: block;
  width: 100%;
  height: 0;
  padding-top: 18vw;
  background-image: url(../images/fightsong/bg_item.png);
  background-position: right center;
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  bottom:-18vw; right:-16vw;
  z-index: 0;
}
#fightsong .teaser-fightsong-about .about-lead{
  margin-bottom: 6.3%;
  padding-bottom: 6.3%;
  text-align: center;
  border-bottom: 1px solid;
  border-image: linear-gradient(45deg, #f2aac9,#0094da) 1;
}
#fightsong .teaser-fightsong-about .about-lead .song{
  line-height: 2.5;
  font-size: 1.3em;
  font-weight: 600;
  color:#bfad6b;
}
#fightsong .teaser-fightsong-comment{
  padding: 10% 0 6.3%;
  position: relative;
  z-index: 1;
}
#fightsong .teaser-fightsong-comment .comment-title{
  color: #102d69;
  text-align: center;
  margin-bottom: 6.3%;
}
#fightsong .teaser-fightsong-comment .comment-title .en{
  font-size: 2.4rem;
  display: block;
  letter-spacing: 0.2em;
}
#fightsong .teaser-fightsong-comment .comment-title .jp{
  display: inline-block;  
  padding: 0 4px;
  color: #fff;
  background-color: #102d69;
  font-size: 1.4rem;
  line-height: 1.2;
  letter-spacing: 0.1em;
}
#fightsong .teaser-fightsong-comment p{
  text-align: justify;
  width: 100%;
  letter-spacing: 0.08em;
}
#fightsong .teaser-fightsong-comment p:last-child{
  margin-bottom: 0;
}

/* ---------------------------------
 SP用
--------------------------------- */
@media screen and (max-width: 992px) {
  .teaser-block-inner{
    overflow: hidden;
  }
  #fightsong .teaser-fightsong-comment .comment-item dt span.q{
  padding-top: 12%;
  }
}
/* ---------------------------------
 tablet用(SP設定を上書き）
--------------------------------- */
@media screen and (min-width : 601px){
  #fightsong .teaser-fightsong-img figure{
    padding-top: 66.72%;
  }
}
/* ---------------------------------
 PC用
--------------------------------- */
@media screen and (min-width: 993px) {
  .teaser-block{
    padding-top: 0;
  }
  #fightsong .teaser-block-title{
    padding-top: 8.13%;
    margin-bottom: 40px;
  }
  #fightsong .teaser-block-lead{
    font-size: 2.8rem;
  }
  #fightsong .teaser-fightsong-img figure{
    padding-top: 66.72%;
  }
  #fightsong .teaser-fightsong-img .fightsong-name{
    padding-top: 6.8%;
    margin-top: 40px;
  }
  #fightsong .teaser-fightsong-about{
    margin: 40px 0 60px;
  }
  #fightsong .teaser-fightsong-about::before{
    padding-top: 60px;
    bottom: -90px;
    right: -20px;
  }
  #fightsong .teaser-fightsong-comment{
    padding: 60px 0 40px;
  }
  #fightsong .teaser-fightsong-comment .comment-title .en{
    font-size: 3.2rem;
  }
  #fightsong .teaser-fightsong-comment p{
    font-size: 1.6rem;
  }
}