@charset "utf-8";
body {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
}
img{
  max-width: 100%;
}


.tss_body{
  padding: clamp(0.75rem, -0.227rem + 3.64vw, 2.5rem) 0 clamp(1rem, -0.675rem + 6.23vw, 4rem);/* 12-40 430-1200 *//* 16-64 430-1200 */
  background-image: url('../img/bg.png');
  background-color: rgb(132, 1, 1);
  background-blend-mode: soft-light;
  background-size: auto;
}
.tss_footer a{
  color: #EE6767;
}


/*---- 試合無い時 -----*/
.tbb_noentry{
  display: inline-block;
  padding: 8em 1em;
  text-align: center;
  background-color: rgba(0,0,0,0.3);
  color: #fff;
  width:100%;
}
.tbb_noentry p{
  font-size:1.5em;
  line-height:2;
}


/* メインビューロゴ */
.tbb_logo-wrap{
  flex: 0 1 auto;
  max-width: 450px;
  width: 82%;
}
.tbb_header{
  position: relative;
  padding-bottom: 16px;
}
.tbb_headingTxt {
  position: absolute;
  right: 0;
  bottom: 0;
  font-size: clamp(1.375rem, 0.4623rem + 3.3962vw, 2.5rem);/* 22-40 430-960 */
  color: #FFFFFF;
  font-weight: 700;
  text-shadow: 0px 3px 0px rgba(91, 40, 0, 1);
}
.tbb_headingAdd{
  display: block;
  font-size: 0.875rem;
  color: #FFFFFF;
  text-align: end;
  margin-top: 24px;
}

/* 次回 */
.tbb_upcoming-wrap {
  flex: 0 1 auto;
}
.tbb_top-wrap {
  display:flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 12px 24px;
  max-width: 1200px;
  margin-inline: auto;
}
.tbb_upcoming-block{
  position: relative;
  padding: 4px;
  background-color: #00004E;
  pointer-events:none;
}
.tbb_upcoming-block::before{
  position: absolute;
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  background-image: url(../img/txt_carp.png);
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events:none;
}
.tbb_upcoming-block::after{
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  content: '';
  width: clamp(3.25rem, -1.712rem + 18.46vw, 6.25rem);/* 52-100 430-690 */
  height: clamp(2.125rem, -0.976rem + 11.54vw, 4rem);/* 34-64 430-690 */
  border: 1px solid #00004E;
  background-color: #FFDD00;
  clip-path: polygon(0 0, 0 100%, 100% 0);
}
.tbb_txtNext{
  position: relative;
  display: inline-block;
  font-size: clamp(0.625rem, -0.4087rem + 3.8462vw, 1.25rem);/* 10-20 430-690 */
  color: #00004E;
  font-weight: 700;
  padding: clamp(0.125rem, -0.495rem + 2.31vw, 0.5rem);/* 2-8 430-690 */
  z-index: 9;
}
.tbb_upcomingFlx{
  position: relative;
  display: flex;
  align-items: end;
  gap: 0 32px;
  margin-top: 20px;
  padding: 0 0 0 24px;
  z-index: 9;
}
.tbb_upcomingDate{
  color: #FFFFFF;
  padding-bottom: 14px;
}
.tbb_date{
  font-size: clamp(1.75rem, -0.8125rem + 5vw, 2.1875rem);/* 28-35 820-960 */
  font-weight: 700;
}
.tbb_num{
  font-size: clamp(3.6875rem, -1.4375rem + 10vw, 4.5625rem);/* 59-73 820-960 */
}
.tbb_time{
  font-size: clamp(1.375rem, -0.0893rem + 2.8571vw, 1.625rem);/* 22-26 820-960 */
  font-weight: 700;
  margin-top: 12px;
}
.tbb_vs{
  font-size: clamp(1.375rem, -0.0893rem + 2.8571vw, 1.625rem);/* 22-26 820-960 */
  font-weight: 700;
  margin-top: 10px;
}
.tbb_place{
  color: #B9B9B9;
  text-align: end;
  /*margin-top: -20px;*/
}

/*-- 出演者枠 --*/
.tbb_photoarea{
  display: flex;
}
.tbb_photoarea > div{
  max-width: clamp(7.5rem, 4.813rem + 10vw, 9.125rem);/* 120-146 430-690 */
}
.tbb_namearea{
  display: flex;
  justify-content: space-around;
  align-items:center;
  width:100%;
}
.tbb_namearea > p{
  text-align: center;
  color:#fff;
  font-size: clamp(0.75rem, 0.5433rem + 0.7692vw, 0.875rem);/* 12-14 430-690 */
  margin-top: 8px;
}

/*-- 注意事項 --*/
.tbb_alert{
  font-size:0.936em;
  margin-top:1em;
  line-height:1.3;
}

/*-- プレゼント枠 --*/
.present_67{
  position: relative;
  display: flex;
  gap: 16px 20px;
  margin-top: 12px;
  padding: 2px;
  background-image: linear-gradient(130deg, rgba(217, 159, 0, 1), rgba(255, 213, 96, 1) 25%, rgb(255 255 255) 50%, rgba(255, 195, 31, 1) 75%, rgba(159, 117, 0, 1));
  z-index: 9;
}
.prsent_logo{
  align-content: center;
  padding: 4px 16px;
  background-color: #00004E;
}
.present_content{padding: 16px 0;}
h3.present_dtl{
  font-size: clamp(0.9375rem, 0.4207rem + 1.9231vw, 1.25rem);/* 15-20 430-690 */
  color: #00004E;
  font-weight: 700;
  line-height: 1.8;
  text-shadow: 2px 2px 0px rgb(255 255 255);
}
p.present_notice{width:fit-content;margin-top: 8px;font-size:0.75em;line-height: 1.2;color: #3D2020;}
/* プレゼント写真 */
div.tbb_presentimg{
  display:flex;
}
.tbb_presentimg img {
  display: block;
  width: 48%;
  max-width: 640px;
  height:auto;
}

/* tbb_formLink */
.tbb_formLink{
  display: block;
  font-weight: 700;
  color: #FFFFFF;
  text-align: center;
  line-height: calc(24/16);
  text-decoration: underline;
  margin-top: clamp(0.5rem, -2.817rem + 7.69vw, 1.125rem);/* 8-18 690-820 */
  transition: text-decoration-color 0.2s ease;
}


/* 試合スケジュール */
.tbb_footer {
  max-width: 1200px;
  margin-inline: auto;
  margin-top: clamp(0.5rem, -4.808rem + 12.31vw, 1.5rem);/* 8-24 690-820 */
  padding: 48px 0;
  background-color: #fff;
  border: 4px solid #00004E;
}
.tbb_gameSchedule{
  max-width: 1000px;
  width: 92%;
  margin-inline: auto;
}
.tbb_gameSchedule li:not(:first-child){
  margin-top: 18px;
  padding-top: 18px;
  border-top: 2px solid #00004E;
}
.tbb_gameSchedule dl {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px 24px;
}
.tbb_gameSchedule dt {
  width: 37%;
}
.tbb_gameSchedule dt p{
  font-size:1.25rem;
  font-weight: 700;
  color: #00004E;
  line-height: calc(30/20);
}
.tbb_gameSchedule dd {
  flex: 1 1 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px 0;
  font-size: clamp(0.875rem, 0.7372rem + 0.5128vw, 1rem);/* 14-16 430-820 */
  color: #00004E;
  font-weight: 700;
}
.tbb_opponent{
  position: relative;
  padding-left: 32px;
}
.tbb_opponent::before{
  content: "VS";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  display: block;
  align-content: center;
  width: 24px;
  height: 24px;
  font-size: 0.875rem;
  color: #FFFFFF;
  text-align: center;
  font-weight: 400;
  background-color: #00004E;
}
.tbb_stadium.tssbbl_home {
  color: #E62C22;
}


/*-- 動画一覧上のブロック --*/
.spl_spch{
  max-width: 650px;
  width: 97%;
  text-align: center;
  margin-inline: auto;
  margin-top: clamp(2rem, 1.173rem + 3.08vw, 2.5rem);/* 32-40 430-690 */
  padding: 20px 8px 10px;
  background-image: linear-gradient(0deg, rgba(154, 39, 238, 0), rgba(112, 0, 0, 1));
  border-radius: 20px 20px 0 0;
}
.spl_spch p{
  font-size: clamp(0.875rem, 0.6683rem + 0.7692vw, 1rem);/* 14-16 430-690 */
  color:#fff;
  font-weight: 700;
  line-height: calc(24/16);
  text-shadow: 0px 2px 0px #5E0000;
}
.spl_link{
  display: inline-block;
  color: #FFDD00;
  line-height: 1;
  border-bottom: 1px solid #FFDD00;
  transition: border-bottom-color 0.2s ease;
}



/*-- 動画一覧 --*/
.tbb_zenryokuch_container{
  width:96%;
  max-width: 1600px;
  margin: 0 auto;
  display:flex;
  flex-wrap:wrap;
  /*
  gap:12px 0;
  justify-content: space-between;*/
  gap: 16px 24px;
  justify-content: center;
}
.tbb_videoBox{
  /*
  width:19.25%;*/
  width:22.25%;
  border-radius: 8px;
}
.tbb_videoBox a{
  display: block;
  border-radius: 8px;
  overflow: hidden;
  color: #000000;
}
.tbb_videoBox a:hover{
  opacity:0.7;
}
.tbb_videoBox img{
  width:100%;
}
.tbb_videoBox div{
  padding: clamp(0.25rem, -1.75rem + 3.33vw, 0.75rem);/* 4-12 960-1200 */
  font-size: 0.875rem;
  background-color: #FFFFFF;
}
.tbb_videoBox a div p {
  -webkit-line-clamp: 3;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.375;
}


/* プレゼント応募方法 */
.present_67call{
  max-width: 880px;
  margin-inline: auto;
  margin-top: clamp(0.75rem, -3.798rem + 16.92vw, 3.5rem);/* 12-56 430-690 */
  padding: 0 8px;
}
.present_67call-block{
  background-color: #FFFFFF;
}
.present_67callHeading{
  font-size: clamp(1rem, 0.7933rem + 0.7692vw, 1.125rem);/* 16-18 430-690 */
  font-weight: 700;
  color: #CC0000;
  text-align: center;
  padding: 10px 0;
  background-image: linear-gradient(130deg, rgba(217, 159, 0, 1), rgba(255, 213, 96, 1) 25%, rgb(255 255 255) 50%, rgba(255, 195, 31, 1) 75%, rgba(159, 117, 0, 1));
}
.present_67call_content{
  max-width: 800px;
  margin-inline: auto;
  padding: 20px 20px 32px;
}
.present_67call > img{
  display: block;
  margin-top: 24px;
}
.present_67call ul {
  margin-top: clamp(0.75rem, -0.077rem + 3.08vw, 1.25rem);/* 12-20 430-690 */
}
.present_67call ul li{
  line-height: calc(20/14);
  font-size: 0.875rem;
}


/*-- 下部リンク --*/
/* .tbb_adarea{
  display: flex;
  width: 100%;
  max-width: 1600px;
  margin: 40px auto;
  flex-wrap: wrap;
  justify-content: space-around;
  align-items: center;
} */


/*-- gototop --*/
#tss_gototop{
  position: fixed;
  width:60px;
  height:60px;
  bottom:90px;
  right:40px;
  border-radius: 30px;
  text-align: center;
  overflow: hidden;
}
#tss_gototop a{
  display: block;
  width:100%;
  height:100%;
  background-color:#790000;
  text-align: center;
  color:#fff;
  text-decoration: none;
  font-weight: bold;
  font-size: 30px;
  padding:14px 0;
}




@media screen and (min-width:769px){
  /* tbb_formLink */
  .tbb_formLink:hover{
    text-decoration-color: transparent;
  }
  /*-- 動画一覧上のブロック --*/
  .spl_link:hover{
    border-bottom-color: transparent;
  }
}



@media screen and (max-width: 800px) {
  .tss_body {
    padding-bottom: calc(17.5vw + 120px);
  }
}



@media screen and (max-width:820px) {
  /*---- 試合無い時 -----*/
  .tbb_noentry p{
    font-size:1.125em;
  }


  /* メインビューロゴ */
  #tbb_upcoming {
    flex-wrap:wrap;
  }
  .tbb_pf{
    width:100%;
  }
  .tbb_pf h2{
    font-size:calc(1.75em + 1vw);
  }


  /* 試合スケジュール */
  .tbb_footer{
    padding: 16px 0;
  }
  .tbb_gameSchedule dt{
    width: 100%;
  }


  /*-- 動画一覧上のブロック --*/
.tbb_zenryokuch_container{
  gap: 16px 2%;
}

  .tbb_videoBox{
    /*width:48.75%;*/
    width:29.75%;
  }


  /*-- 下部リンク --*/
  .tbb_adarea{
    display: block;
    width: auto;
  }
  .tbb_adarea > div{
    width: 320px;
    margin: 0 auto 50px;
  }
  .tbb_adarea > div:first-of-type{height: auto;}
  .tbb_adarea .tbb_video{
    font-size:1.125em;
  }
}



@media screen and (max-width:690px){
  /* メインビューロゴ */
  .tbb_headingTxt{
    right: 32px;   
    bottom: 12px;
  }
  .tbb_headingAdd{
    display: none;
  }


  /* 次回 */
  .tbb_upcomingFlx{
    flex-direction: column;
    align-items: center;
    margin-top: 0;
    padding: 0;
  }
  .tbb_date{
    text-align: center;
  }
  .tbb_time{
    margin-top: 4px;
  }
  .tbb_vs{
    margin-top: 4px;
  }
  .tbb_vs img{
    max-width: 40px;
  }
  .tbb_place{
    text-align: center;
    margin-top: -4px;
  }
  .tbb_upcomingDate{
    padding-bottom: 0;
  }
 
  /* tbb_formLink */
  .tbb_formLink_sp{
    display: block;
  }


  /* 試合スケジュール */
  .tbb_gameSchedule dd{
    flex-direction: column;
    align-items: baseline;
  }
  .tbb_opponent.tssbbl_home::before{
    background-color: #FF0808;
  }

  
  /*-- 動画一覧上のブロック --*/
  .spl_link{
    border-bottom: none;
  }


  /*-- プレゼント枠 --*/
  .present_67{
    flex-wrap: wrap;
    padding: 6px;
  }
  .present_content{
    padding: 0;
  }
  .prsent_logo{
    display: block;
    margin-inline: auto;
    padding: 4px 16px;
  }
}

@media screen and (max-width: 480px) {
    .tbb_videoBox {
        width: 90%;
    }
}