@charset "utf-8";
/* CSS Document */
img{max-width: 100%;}

.pad_body{position: relative;overflow-x: hidden;}
.pad_body::after{
  content: '';
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  background: url("../img/ph_bg.jpg") center top no-repeat;
  z-index: -1;
}
.pad_body::before{
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 1780px;
  height: 100%;
  background: url(
  ../img/deco_bg.webp) center top no-repeat;
  background-size: contain;
  z-index: 2;
  pointer-events: none;
}
.pad_body>*{position: relative;z-index: 1;}
.pad_wrap{
  max-width: 1100px;
  margin: auto;
  padding: 0 16px;
}


.pad_mvWrap{
  max-width: 1250px;
  margin-inline: auto;
  margin-bottom: 16px;
}
.pad_mv{
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  max-width: 1000px;
  width: 100%;
  margin-inline: auto;
}
.pad_mv img {aspect-ratio: 1000 / 500;}
.pad_logoWrap{
  position: relative;
  display: flex;
  justify-content: center;
  max-width: 980px;
  margin-inline: auto;
}
.pad_logo{
  max-width: 430px;
  padding-top: clamp(8.75rem, 7.007rem + 14.49vw, 17.25rem);
}
.pad_logo_alpha{
  position: absolute;
  bottom: 0;
  right: 0;
  max-width: clamp(7.813rem, 4.83rem + 11.1vw, 13.5rem);/*125-216 430-1250*/
}
.pad_oa{
  max-width: 960px;
  margin-inline: auto;
}
.pad_whtabt{
  max-width: 888px;
  width: 85%;
  margin-inline: auto;
  margin-top: 32px;
}
.pad_character{
  position: absolute;
  top: 330px;
  width: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}
.pad_character_hiromin,
.pad_character_momin{
  max-width: clamp(3.375rem, 0.163rem + 11.95vw, 9.5rem);/*54-152 430-1250*/
}


/* 私たちがお伝えします! */
.pad_personality{
  max-width: 1100px;
  margin:auto;
  padding: 32px 0 24px;
  border-radius: 40px 40px 0 0;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(247, 249, 187, 0.72) 20%, rgba(247, 249, 187, 1));
}
.pad_personality h2{
  width: 80%;
  margin-inline: auto;
  text-align: center;
}
.pad_personality div{
  display: flex;
  justify-content: space-around;
  gap:24px;
  max-width:1060px;
  margin-inline: auto;
  margin-top: 24px;
  flex-wrap:wrap;
}
.pad_personality div p{
  width:38.33%;
  max-width: 190px;
}


/* ひろみん、Dr.モーミンが楽しく解説! */
.pad_character_explainWrap{
  position: relative;
  padding: 40px clamp(8px,2vw,16px) ;
  border-radius: 0 0 40px 40px;
  background-color: #C5F9BB;
  max-width: 1100px;
  margin:auto;
}
.pad_character_explainWrap::after{
  content: '';
  display: block;
  width: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 100%;
  /* ChromeやSafariなどの他のモダンブラウザ用 */
  height: -webkit-fill-available;
  height: stretch;
  background-image: url(../img/deco_charabg.webp);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
}
.pad_character_explainWrap h2{position: relative;margin-inline-end: 100px;text-align: center;z-index: 1;}
.pad_character_explainFlx{
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 16px;
  max-width: 906px;
  width: 82.36%;
  margin-inline: auto;
  margin-block-start: -40px;
}
.pad_character_explain{
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 32px;
}
.pad_character_explainImg{
  max-width: 268px;
  margin-inline: auto;
}
.pad_character_explainName_hiromin{
  /* margin-top: -16px; */
  text-align: right;
}


/* 様子写真 */
.pad_explanboxWrap{
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 24px;
}
.pad_explanbox h2{
  max-width: 960px;
  margin-inline: auto;
}
.pad_explanbox ul{
  display:flex;
  justify-content:center;
  gap: 20px;
}
.pad_explanbox ul li{
  max-width: 540px;
  margin-inline: auto;
}
.pad_excuse{
  margin-top: 16px;
  font-size:0.875rem;
  color: #885500;
  text-align:right;
}


/* 番組アーカイブはこちら */
.pad_ytb{
  margin-bottom: 64px;
  text-align: center;
}
.pad_ytb div{
  position: relative;
  margin-bottom:24px;
}
.pad_ytb h3{
  font-size: 2rem;
  font-weight: bold;
  color: #D26E3A;
  margin-bottom:1em;
}
.pad_ytb a{
  display: inline-block;
  height: 360px;
  overflow: hidden;
}
.pad_ytb img{margin-top: -60px;}
.pad_play{
  position: absolute;
  left: calc(50% - 40px);
  top: calc(50% + 24px);
  pointer-events: none;
}
.pad_ytb p{font-size: 1.25rem;margin-top:8px;}


/* この番組への意見をぜひお寄せください */
.pad_link{
  margin: 64px 0;
  padding: 50px;
  text-align: center;
  background-color: #F9F2CB;
  border: 2px solid #FFCB0E;
  border-radius: 40px;
}
.pad_link h3{
  margin-bottom: 30px;
  font-size: 2rem;
  font-weight: bold;
  color: #D26E3A;
}
.pad_link .pad_presentbtn{
  display: inline-block;
  width: 600px;
  height: 90px;
  margin-bottom: 30px;
  padding-top: 28px;
  text-decoration: none;
  font-size: 1.875rem;
  font-weight: bold;
  text-align: center;
  color: #FFFFFF;
  text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.77);
  border-radius: 45px;
  background: linear-gradient(#d5737c 0%, #bb0e01 100%);
  border: 3px solid #FFFFFF;
  box-shadow: 0px 6px 0px rgba(0, 0, 0, 0.28);
}
.pad_present p{
  margin-bottom: 40px;
  font-size: 1.25rem;
}
.pad_present img{max-width: 36%;}
.pad_limit{
  line-height: 1.5;
  font-size: 1.5rem;
  font-weight: bold;
}
.pad_presentcaution{
  font-size:0.65rem;
  padding-top:1em;
  line-height:1.375;
}
.pad_presentcaution a{
  color:#000;
}


/* 今後の放送 */
/* .pad_bottom{
  padding: 88px 0 96px;
  background: url("../img/il_btmbg.svg") repeat;
  background-color: rgba(151,228,238,0.8);
  background-blend-mode: soft-light;
}
.pad_bottom h2{text-align: center;}
.pad_bottom h2 img{width: 342px;}
.pad_bottom dl{
  display: flex;
  flex-wrap: wrap;
  line-height: 2;
  margin-top: -64px;
  padding: 80px 260px 40px;
  font-size: 1.875rem;
  font-weight: bold;
  color: #3B3B3B;
  background: url("../img/il_michel.png") right 72px top 52px / 196px 196px no-repeat;
  background-color: #FFFFFF;
}
.pad_bottom dt{width: 310px;}
.pad_bottom dd{width: calc(100% - 310px);}
.pad_bottom .pad_wrap > p{
  text-align:center;
  padding:1em 0;
  background-color:#FFF;
} */


#tss_gototop img{width: 80px;}
.tss_footer{margin-top: 32px; background-color: #0B3151 !important;}



@media screen and (min-width:769px){
  /* 番組アーカイブはこちら */
  .pad_ytb a:hover{opacity: 0.7;}
  .pad_ytb a:hover+img{opacity: 0.7;}
  /* この番組への意見をぜひお寄せください */
  .pad_link a:hover{opacity: 0.7;}
}



@media screen and (max-width:1250px){
  .pad_character{top: 64px;}
}



@media screen and (max-width:800px){
  .tss_body{padding-bottom: calc(17.5vw + 120px);}
  .pad_body::before{content: none;}

  .pad_mvWrap{
    display: grid;
    grid-template-columns: repeat(2, auto);
    grid-template-rows: repeat(2, auto);
  }
  .pad_logoWrap{display: contents;}
  .pad_logo{
    position: relative;
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    margin-bottom: clamp(
      -88px,
      calc(-72px + (-16) * ((100vw - 430px) / 370)),
      -72px
    );/* -72- -88 430-800*/
  }
  .pad_logo_alpha{
    position: unset;
    grid-column: 2 / -1;
    grid-row: 2 / -1;
    max-width: clamp(7.813rem, 1.203rem + 24.59vw, 13.5rem);/*125-216 430-800*/
  }
  .pad_oa{
    align-content: end;
    grid-column: 1 / 2;
    grid-row: 2 / -1;
  }
  .pad_character{
    position: relative;
    top: 0;
    justify-content: unset;
    grid-column: 2 / -1;
    grid-row: 1 / 2;
  }
.pad_personality {
    max-width: 600px;}

  /* ひろみん、Dr.モーミンが楽しく解説! */
  .pad_character_explainWrap{
    padding-top: 24px;
    max-width: 600px;   
  }
  .pad_character_explainWrap::after{
    content: '';
    display: block;
    width: 120%;
    background-image: url(../img/deco_charabg_sp.webp);
    background-position: center clamp(
      18px,
      calc(56px + (-38) * ((100vw - 430px) / 370)),
      56px
    );/*56-18 430-800*/
    background-size: clamp(23.5rem, -2.213rem + 95.68vw, 45.625rem);/*376-730 430-800*/ 
  }
  .pad_character_explainWrap h2{margin-inline: auto;}
  .pad_character_explainFlx{
    position: unset;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(2, auto);
    gap: 0 16px;
    width: 100%;
    margin-block-start: 0;
  }
  .pad_character_explainImg{
    grid-column: 1/-1;
    grid-row: 1/2;
    max-width: unset;
    margin-bottom: -2px;
    text-align: center;
  }
  .pad_character_explainImg img{width: 50%;min-width: 188px;}
  .pad_character_explain{margin-bottom: 0;}
  .pad_character_explainName_hiromin{margin-top: 0; text-align: unset;}
  .pad_character_explain_hiromin{
    order: 1;
    flex-direction: column-reverse;
    height: 100%;
    justify-content: flex-end;
    padding-left:5%;
  }
  .pad_character_explain_momin{
    order: 2;
    padding-right: 5%;
  }
  .pad_character_explain_momin h3,
  .pad_character_explain_momin img{display: block; margin-inline-start: auto;}


  /* 様子写真 */
  .pad_explanbox:first-child h2{margin-bottom: 8px;}
  .pad_explanbox ul{flex-direction: column;}
  

  /* 番組アーカイブはこちら */
  .pad_ytb{
    width: 343px;
    margin: 0 auto 64px;
  }
  .pad_ytb h3{font-size:1.375rem;margin-top:2em;}
  .pad_ytb a{height: 177px;}
  .pad_ytb img{margin-top: -43px;}
  .pad_play{top: calc(50% - 16px);}
  .pad_ytb p{font-size: 1rem;}


  /* 今後の放送 */
  /* .pad_bottom h2{padding: 0 84px;}
  .pad_bottom h2 img{width: 100%;}
  .pad_bottom dl{
    margin-top: -18px;
    padding:20px 24px 40px;
    font-size: .875rem;
    background-size: 120px 120px;
    background-position: right bottom;
  }
  .pad_bottom dt{width: 50%;}
  .pad_bottom dd{width: 50%;}
  .pad_bottom .pad_wrap > p{
    font-size:0.87rem;
    margin-top:1rem;
  } */


  /* この番組への意見をぜひお寄せください */
  .pad_link{padding: 24px;}
  .pad_link h3{
    font-size: 1.25rem;
    margin-bottom: 20px;
  }  
  .pad_present{font-size: 0.875rem;}
  .pad_present p{
    font-size: 0.875rem;
    margin-bottom: 20px;
    line-height:1.3;
  }
  h3 span{
    display:block;
    line-height:1.3;
  }
  .pad_present img{max-width: 72%;}
  .pad_link .pad_presentbtn{
    width: 100%;
    height: 64px;
    padding-top: 20px;
    font-size: 1rem;
  }
  .pad_limit{font-size:.875rem;}
}