@charset "UTF-8";
/** cmn_layout.css by minasupo**/
/* Reseting
---------------------------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, ins, kbd, q, s, samp, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-style: normal;
font-weight: normal;
vertical-align: baseline;
}
/* Typography
---------------------------------------------------------- */
html {
font-size: 62.5%;
}
body {
height: 100%;
font-size: 1.6rem; /*1rem = 10px*/
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Hiragino Sans", "Noto Sans CJK JP", "Original Yu Gothic", "Yu Gothic", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Sans Emoji";
color: #222;
}
html, body {
width: 100%;
/*overflow-x: hidden;*/
overflow-x: visible !important;
box-sizing: border-box;
}
@font-face {
font-family: "Original Yu Gothic";
src: local("Yu Gothic Medium");
font-weight: 100;
}
@font-face {
font-family: "Original Yu Gothic";
src: local("Yu Gothic Medium");
font-weight: 200;
}
@font-face {
font-family: "Original Yu Gothic";
src: local("Yu Gothic Medium");
font-weight: 300;
}
@font-face {
font-family: "Original Yu Gothic";
src: local("Yu Gothic Medium");
font-weight: 400;
}
@font-face {
font-family: "Original Yu Gothic";
src: local("Yu Gothic Bold");
font-weight: bold;
}
a {
cursor: pointer;
text-decoration: none;
}
a,
a:visited {
color: inherit;
}

/* Layout
---------------------------------------------------------- */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
* {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/* Elements
---------------------------------------------------------- */
table {
border-collapse: collapse;
border-spacing: 0;
font-size: 100%;
}
caption, th {
text-align: left;
}
ol, ul {
list-style: none;
}
img {
margin: 0;
padding: 0;
border: 0;
font-style: normal;
font-weight: normal;
font-size: 100%;
vertical-align: bottom;
border-style: none;
}
input, textarea {
margin: 0;
padding: 0;
font-size: 100%;
}

a:focus {
outline: none;
}
table {
width: 100%;
}
/* font
---------------------------------------------------------- */
.tpMin {
font-family: "游明朝体", YuMincho, "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", Georgia, Times, "Times New Roman", serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
.tpGot {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Hiragino Sans", "Noto Sans CJK JP", "Original Yu Gothic", "Yu Gothic", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Sans Emoji";
}
/* Clearfix
---------------------------------------------------------- */
.clearfix {
*zoom: 1;
}
.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

* {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
img {
  max-width: 100%;
  height: auto;
}

/* Layout
---------------------------------------------------------- */
html { overflow-y: scroll;}
body { background-image: url(../images/bg.jpg); overflow-x: hidden; background-size: 100px;}

.sp_none { display: none;}
.pc_none { display: inherit;}

@media screen and (min-width: 569px) {
.sp_none { display: inherit;}
.pc_none { display: none;}
}

.layout-box01 {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 15px 30px;
}
.layout-box02 {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 15px;
}
.layout-box03 {
  max-width: 900px;
  margin: 0 auto;
}
/* wrapper
---------------------------------------------------------- */
.wrapper {
  width: 100%;
}
.container {
  max-width: 1000px;
  text-align: left;
}

.sp_none {
    display: none !important;
}

/* header
---------------------------------------------------------- */
.header {
  position: relative;
  background: none;
  z-index: 1;
}
.header-inner {
  padding: 0;
  z-index: 100;
}
.header-title {
  width: 100%;
  max-width: 1000px;
  height: auto;
  margin: 0 auto;
  text-align: center;
}
.header-time {
  position: absolute;
  width: 30%;
  height: auto;
  top: 90px;
  right: 10px;
  z-index: 10;
}
@media screen and (min-width: 480px) {
.header-time {
  top: 120px;
  right: 10px;
}
}
@media screen and (min-width: 569px) {
.wrapper {
  -webkit-transform:: translate3d(0, 0, 0);
  -moz-transform:: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  -webkit-transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  transition: all 300ms ease;
}
.container {
  position: inherit;
  margin: 0 auto;
  padding: 0;
}
.header-inner {
  width: 100%;
  margin: 0 auto;
  padding: 15px 0;
}
.header-title { }
.header-time {
  width: 188px;
  top: 30px;
  right: 10px;
}
}
@media screen and (min-width: 769px) {
.header-inner {
  padding: 0;
}
.header-time {
  width: 188px;
  top: 30px;
  right: -30px;
}
}
/* slider
---------------------------------------------------------- */
#slider {
  width: 100%;
  height: auto;
  padding: 8px 0;
}
#slider img {
  display: none;
}
#slider img:first-child {
  display: block;
}
.indicators {
  display: none;
}
@media screen and (min-width: 569px) {
#slider {
  max-width: 1000px;
  margin: 0 auto;
  padding: 10px 0;
}
}
/* snsNav
---------------------------------------------------------- */
.snsnav {
  margin: 20px auto;
}
.snsnav-list {
  display: flex;
  justify-content: center;
  margin: 0 auto;
}
.snsnav-item {
  display: block;
  width: 40px;
  height: 40px;
  margin: 0 1%;
  background-size: contain;
}
.snsnav-item a {
  display: block;
  width: 40px;
  height: 40px;
}
.snsnav-item._mail { background-image: url(../images/ico_mail_on.svg);}
.snsnav-item._facebook { background-image: url(../images/ico_facebook_on.svg);}
.snsnav-item._instagram { background-image: url(../images/ico_instagram_on.svg);}
.snsnav-item._twitter { background-image: url(../images/ico_twitter_on.svg);}
.snsnav-item._mail:hover { background-image: url(../images/ico_mail_off.svg);}
.snsnav-item._facebook:hover { background-image: url(../images/ico_facebook_off.svg);}
.snsnav-item._instagram:hover { background-image: url(../images/ico_instagram_off.svg);}
.snsnav-item._twitter:hover { background-image: url(../images/ico_twitter_off.svg);}

@media screen and (min-width: 569px) {
.snsnav {
  margin: 30px auto;
}
.snsnav-item {
  width: 50px;
  height: 50px;
  margin: 0 1%;
}
.snsnav-item a {
  width: 50px;
  height: 50px;
}
}
/* contents
---------------------------------------------------------- */
.contents {
  width: 100%;
  margin: 0 auto 30px;
  padding: 30px 20px;
  text-align: left;
}
.contents2{
  width: 100%;
  margin: 30px auto ;
}


/* youtube----------------------- */
.youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtube iframe {
  width: 100%;
  height: 100%;
}

/* corner cast */
.corner,
.cast {
  width:100%;
  margin: 20px auto;
}
.corner-tit-inner,
.cast-tit-inner {
  border-bottom: solid 1px #000;
}
.corner-tit,
.cast-tit {
  display: table;
  margin: 0 0 -3px 0;
  font-size: 1.8rem;
  color: #000;
  letter-spacing: 3px;
  text-align: left;
  font-weight: bold;
}
.tb_line {
  border-radius: 3px;
  border-left: 1px solid #000;
  border-right: 1px solid #000;
}
.tb_line::before,
.tb_line::after {
  content: '';
  display: block;
  height: 3px;
  width: 100%;
  background: -webkit-gradient(linear, left top, right bottom, from(#000), to(#000));
  background: -moz-linear-gradient(left, #000, #000);
  background: linear-gradient(left, #000, #000);
}

@media screen and (min-width: 569px) {
.contents {
  margin: 0 auto 10px;
  padding: 0 30px;
}
.corner,
.cast {
  width:100%;
  margin: 30px auto;
}
.corner-tit,
.cast-tit {
  font-size: 2rem;
}
}
@media screen and (min-width: 769px) {
.contents {
  margin: 0 auto 15px;
  padding: 30px 80px;
}

}
/* corner-list */
.corner-list {
  width: 100%;
  margin: 0 auto;
  padding: 10px 0;
}
.corner-item {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin: 0;
  padding: 20px 0;
  font-size: 1.4rem;
  line-height: 1.5;
  border-bottom: dotted 1px #e00;
}
.corner-item:last-child {
  border-bottom: none;
}
.corner-item a:hover {
  color: #e00;
  text-decoration: none;
}
.corner-logo {
  width: 90%;
  margin: 0 auto 20px auto;
}
.corner-txt {
  width: 100%;
  font-size: 1.4rem;
  line-height: 1.6;
}
@media screen and (min-width: 569px) {
.corner-list {
  padding: 20px 0;
}
.corner-item {
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  font-size: 1.4rem;
}
.corner-item:last-child {
  border-bottom: none;
}
.corner-logo {
  width: 30%;
  margin: 0;
}
.corner-txt {
  width: 65%;
  font-size: 1.5rem;
}
}
/* cast */
.cast-list {
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
  padding: 20px 0;
}
.cast-item {
  display: block;
  width: 90%;
  margin: 15px auto;
}

/*.cast-img img {
  border: solid 5px #000;
  border-radius: 5px;
}*/

.cast-name {
  margin: 6px 0;
  font-size: 1.8rem;
  line-height: 1.2;
  letter-spacing: 0em;
  font-weight: bold;
  color: #000;
  text-align: center;
}
.cast-profile {
  width: 100%;
  margin-bottom: 8px;
  font-size: 1.4rem;
  line-height: 1.6;
}
.cast-link {
  width: 100%;
  margin: 5px 0 5px 10px;
  padding: 0;
  font-size: 1.3rem;
  line-height: 1.2;
  white-space: nowrap;
}
.cast-link:before {
  content: '■';
  margin: 0 .3em 0 -1em;
  color: #e00;
  font-size: 1rem;
}
@media screen and (min-width: 569px) {
.cast-list {
  justify-content: space-between;
  max-width: 700px;
  margin: 10px auto;
  padding: 30px 0;
}
.cast-item {
  width: 47%;
  margin: 0;
}
.cast-name {
  margin: 8px 0;
  font-size: 2rem;
}
.cast-profile {
  margin-bottom: 8px;
  font-size: 1.4rem;
}
.cast-link {
  margin: 6px 0 6px 10px;
  font-size: 1.3rem;
}
}

/*---fujilover add----*/
.chapter-tit{
  font-weight:bold;
  font-size:1.6rem;
  color:#000;
}

.img_banner{
  margin: 0 auto;
  overflow: hidden;
}
.img_banner img{
  width: 100%;
  cursor: pointer;
  transition-duration: 0.3s;
}
.img_banner:hover img{
  opacity: 0.6;
  transition-duration: 0.3s;
}

/*---fujilover add----*/

/* annerbox
---------------------------------------------------------- */
.bannerbox { }
.bannerbox-list {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin: 10px auto 20px auto;
  padding: 0 20px;
  text-align: center;
}
.bannerbox-item {
  display: block;
  width: 80%;
  margin: 10px auto;
  padding: 0;
}
@media screen and (min-width: 569px) {
.bannerbox-list {
  justify-content: space-between;
  margin: 40px auto;
  padding: 0 30px;
}
.bannerbox-item {
  width: 32%;
  margin: 0;
}
}
@media screen and (min-width: 769px) {
.bannerbox-list {
  margin: 50px auto;
  padding: 0 80px;
}
}
/* footer
---------------------------------------------------------- */
.footer {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 0;
  text-align: center;
}
.sbs-logo {
  width: 62px;
  height: auto;
  margin: 15px auto;
}
.footer-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.footer-item {
  margin: 5px 0;
  padding: 0 5px;
  font-size: 1.2rem;
  line-height: 1.4;
}
.footer-copyright {
  width: 100%;
  padding: 10px;
  font-size: 1.1rem;
  letter-spacing: 0.1em;
  text-align: center;
  color: #000;
}
/* page-top */
.page-top {
  width: 50px;
  height: 50px;
  margin: 10px auto;
}
.page-top a {
  position: relative;
  display: block;
  height: 50px;
  width: 50px;
  border: 1px solid #000;
  border-radius: 40px;
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.page-top a:hover,
.page-top a:hover .arrow:before {
  border-color: #FFF;
}
.page-top a .arrow {
  overflow: hidden;
  height: 25px;
}
.page-top a .arrow:before {
  content: '';
  height: 20px;
  width: 20px;
  display: block;
  border: 2px solid #000;
  border-left-width: 0;
  border-bottom-width: 0;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  position: absolute;
  top: 39%;
  left: 28%;
}

@media screen and (min-width: 569px) {
.footer {
  width: 980px;
}
.sbs-logo {
  width: 80px;
  margin: 15px auto;
}
.footer-item {
  margin: 5px 0;
  padding: 0 8px;
  font-size: 1.3rem;
  border-right: solid 1px #000;
}
.footer-item:last-child {
  border-right: none;
}
.footer-copyright {
  padding: 10px;
  font-size: 1.2rem;
}
}
/* facebook
---------------------------------------------------------- */
.facebook {
  width: 100%;
  margin: 30px auto;
  text-align: center;
}

.timeline {                /*20230112 shibayama*/
  max-width: 100%;
  border: 1px solid #333;
  padding: 10px;
}
.iframe-wrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.iframe-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
  display: block;
}
@media screen and (min-width: 569px) {
.facebook-inner {
  margin: 50px auto;
}
.timeline {                /*20230112 shibayama*/
  max-width: 50%;
  margin:10px auto;
}
}

/*20230809 shibayama*/
.sp_br {
  display: none;
}
@media screen and (max-width: 768px) {
  .sp_br {
    display: block;
  }
}

/* tvstation
--------------------------*/
.tvstation {
  margin: 30px auto;
}
.tvstation .secBox01 {
  position: relative;
  padding: 40px 20px;
}
.tvstation-tit { }
.tvstation-list {
  max-width: 90%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  font-size: 1.6rem;
  line-height: 1.2;
}
.tvstation-item {
  width: 90%;
  margin: 0;
  padding: 10px 5%;
  border-bottom: solid 1px #666;
}
.tvstation-item:nth-child(1) {
  border-top: solid 1px #666;
}
.tvstation-item dl {
  display: flex;
}
.tvstation-item dl dt {
  width: 60px;
}
@media only print, screen and (min-width: 569px) {
.tvstation {
  margin: 30px auto;
  padding-bottom:30px;
}
.tvstation .secBox01 {
  padding: 50px 30px 40px 30px;
}
.tvstation .onair-tit {
  position: absolute;
  width: 280px;
  top: -40px;
  padding: 10px 15px;
  font-size: 2rem;
}
.tvstation-list {
  max-width: 620px;
  margin: 0 auto;
  flex-direction: row;
  flex-flow:row wrap;
  justify-content: space-between;
  font-size: 1.3rem;
}
.tvstation-item {
  width: 48%;
  margin: 0;
  padding: 10px 1%;
}
.tvstation-item:nth-child(1),
.tvstation-item:nth-child(2),
.tvstation-item:nth-child(3) {
  border-top: solid 1px #666;
}
.tvstation-item dl dt {
  width: 50px;
}
}
@media screen and (min-width: 960px) {
.tvstation-list {
  max-width: 860px;
  min-width: 700px;
  font-size: 1.6rem;
}
.tvstation-item {
  padding: 13px 2% 12px 2%;
}
.tvstation-item dl dt {
  width: 55px;
}
}


