@charset "utf-8";
/* ----------------------------

File Name:  slick.css
Last Update:2026-03-30
/* トップ・CMS記事部分用 (スワイパ―・タブ含む)
2026.3にTOPスワイパー用の追加
・top_slick.min.js
・jquery-1.7.2.min.js
・top_swiper.min.css
・top_swiper.min.js
---------------------------- */

/*共通：リンクテキスト設定*/
.swiper-slide a ,
.swiper-slide a:hover ,
.swiper-slide a:visited ,
.swiper-slide a:active,
#article_list a ,
#article_list a:hover
#article_list a:visited ,
#article_list a:active
{ color: #222; text-decoration: none; transition:0.1s;}

/*番組新着記事・番組一覧段組------------------------------------------------------------------------------*/

.unit_flexbox {
	display: flex;
	flex-wrap: wrap;
}

/*番組新着記事・大枠*/ #article_list  { margin-top:-4%; }
/*番組一覧タブ・大枠*/ul.unit_flexbox {}

.unit_flexbox article , .unit_flexbox li{ 
	width: 48.5%;
	margin-top: 4%;
	margin-right: 2.5%;
	border-radius: 5px;
}
.unit_flexbox article:nth-child(2n),
.unit_flexbox li:nth-child(2n)
{ margin-right:0; }

/*サムネイル*/
.featured_image {
    position: relative;
    overflow: hidden;
	padding-left:100%;
	width: 100%;
}
/*番組新着記事写真*/
.unit_flexbox article .featured_image ,
.swiper-slide article .featured_image{ padding-top: 56.25%; }

/*番組新着記事写真*/
#article_list .featured_image ,
.swiper-slide article .featured_image { border-radius: 5px 5px 0 0; }

/*番組一覧タブ写真*/
/*9:16比*/.unit_flexbox li .featured_image{ padding: 56.25% 2px 0;}
/*ラジオのみ(9:12)*/.tab_radio.unit_flexbox li .featured_image{ padding: 62.5% 2px 0;}
.unit_flexbox li .featured_image,
.unit_flexbox li a:visited .featured_image{ border: solid 2px rgba(0,0,0,0.02);}
.unit_flexbox li a:hover .featured_image,
.unit_flexbox li a:active .featured_image{ border: solid 2px rgba(255,59,63,0.1); transition:0.1s; }

.featured_image img {
    position: absolute;
    top: 50%;
    left: 50%;
	transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    object-fit: cover;
	border-color: none;
}

/*もっと見るボタン*/
#more_btn,#close_btn
{ margin: 4% auto 0; }

@media print, screen and (min-width: 520px) {
#article_list  { margin-top: -2.5%; }
ul.unit_flexbox{ padding: 0 0 0;}

.unit_flexbox article,
.unit_flexbox li
	{ width: 31.64%; margin-top: 2.5%; margin-right: 2.5%;  }

.unit_flexbox article:nth-child(2n),
.unit_flexbox li:nth-child(2n)
	{ margin-right:2.5%; }

.unit_flexbox article:nth-child(3n),
.unit_flexbox li:nth-child(3n)
	{ margin-right:0;}

.unit_flexbox li .featured_image{ border-width: 3px; padding: /*62.5%*/56.25% 3px 0; }
/*TVのみ*/.tab_btn.unit_flexbox li .featured_image{ padding: 56.25% 3px 0;}
.unit_flexbox li a:hover .featured_image{ border-width: 3px; transition:0.1s;}
	
#more_btn,#close_btn { margin: 2.5% auto 0; }
}

@media print, screen and (min-width: 960px) {
ul.unit_flexbox{ padding: 0 0 0; }
.unit_flexbox article,
.unit_flexbox li
	{ width: 23.095%; margin-right:2.5%; border-radius: 7px; }

#article_list .featured_image ,
.swiper-slide article .featured_image { border-radius: 7px 7px 0 0; }
	
.unit_flexbox article:nth-child(3n),
.unit_flexbox li:nth-child(3n)
	{ margin-right:2.5%; }

.unit_flexbox article:nth-child(4n),
.unit_flexbox li:nth-child(4n)
	{ margin-right:0; }
	
.unit_flexbox li .featured_image{ border-width: 4px; padding: /*62.5%*/56.25% 4px 0; }
	
/*TVのみ*/.tab_btn.unit_flexbox li .featured_image{ padding: 56.25% 4px 0;}
.unit_flexbox li a:hover .featured_image{ border-width: 4px; transition:0.1s;}
#more_btn,#close_btn { margin: 1.25% auto 0; }
}

/* 番組一覧tab--------------------------------------------------------------------------- */
.area_program{ background: #fff; }

.area_program a { color:#222; }
.area_program a:hover { color:#ff3b3f; transition:0.1s;}

/* アナウンサー一覧tab--------------------------------------------------------------------------- */
.area_ana{ margin: -4% auto 0;  }

.area_ana a { color:#222; }
.area_ana a:hover { color:#ff3b3f; transition:0.1s; }
@media print, screen and (min-width: 960px) {
.area_ana{ margin: -2.5% auto 0; }
 }
.tab_line { margin-top:5px;}

/* tab (ラジオ番組表と基本は同じ)*/
.tabs {
  margin: 0 auto;
  background: #fff;
}
.tab_item {
  position: relative;
  display: block;
  width: calc(100% / 7);
  padding: 2.5%;
  float: left;
  color: #7f7f7f;
  font-size: 1.5rem;
  font-weight: bold;
  letter-spacing: 0.08em;	
  line-height: 1.2;
  text-align: center;
  box-sizing: border-box;
}
.tab_item .date, .tab_item .week { display: inline-block; }
.tab_item:hover { color: #d70b24; transition:0.1s; }
.tab_item::before {
  content: '';
  position: absolute;
  top: 10px;
  left: 0;
  display: block;
  width: 1px;
  height: calc(100% - 20px);
  background: #c9c9c9;
}
.tab_item:first-of-type::before { display: none; }
.tabs input:checked + .tab_item { color: #d70b24; }
.tab_item::after { 
	content: '';
	position: absolute;
	left: 2px;
	bottom: -5px;
	display: block;
	width: calc(100% - 4px);
	height: 5px;
	background: #f3f3f3;
}
.tabs input:checked + .tab_item::after { background: #d70b24; }
input[name="tab_item"] { display: none; }
.tab_content {
  display: none;
  padding: 0;
  clear: both;
  overflow: hidden;
}

/* tabボタン式・ラジオ番組表と基本は同じ*/
.tab_btn { margin-top: -12px;}

.tab_item_btn{
  position: relative;
  display: inline-block;
  margin: 0 1.5% 12px 0;
  float: left;
  letter-spacing: 0.1em;
  background-repeat: no-repeat;
  box-sizing: border-box;
  height: 38px;
  padding: 0.6rem 34px 0 17px;
  background-image: url("../../image/icon_btn_submore_red.svg") , url("../../image/icon_btn_submore_w.svg");
  background-position: right 13px center;
  background-size: 13px auto , 0px auto;
  border-radius: 19px;
  font-size: 1.4rem;
  background-color:#fff;
  color: #d70b24;
  border: solid 1px #d70b24;
  text-decoration: none;
  transition:0.1s;
  font-weight: bold;
}
.tab_item_btn::before{ 
display: block; width: 50px; height: 20px;background: #000;
}

.tab_item_btn .date, .tab_item_btn .week { }
.tab_item_btn:hover,
.tabs input:checked + .tab_item_btn
{ background-color: #d70b24; color: #ffffff; transition:0.1s; background-size: 0 auto , 13px auto; }

input[name="tab_item_btn"] { display: none; }

/* tab 曜日 */
.tab_item_btn span{display: inline-block;}
.tab_item_btn span:nth-child(2){display: none;}

@media print, screen and (min-width: 520px) {

.tab_item_btn {
	height: 50px;
	padding: 1.2rem 38px 0 20px;
	background-position: right 15px center;
	background-size: 15px auto , 0px auto;
	border-radius: 25px;
	font-size: 1.5rem;
}

.tab_item_btn .date, .tab_item_btn .week { }
.tab_item_btn:hover,
.tabs input:checked + .tab_item_btn
{ background-color: #d70b24; color: #ffffff; transition:0.1s; background-size: 0 auto , 15px auto; }
}

#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content,
#tab3:checked ~ #tab3_content,
#tab4:checked ~ #tab4_content,
#tab5:checked ~ #tab5_content,
#tab6:checked ~ #tab6_content,
#tab7:checked ~ #tab7_content {
  display: block;
}

/* 各番組パーツ*/

.unit_flexbox li h3 { /*番組名*/
	font-weight: bold;
	font-size: 1.5rem;
	line-height: 1.5;
	margin-top:3%;
 }

.unit_flexbox_ana{ text-align: center;}

.unit_flexbox li p{/*時間*/
	font-size: 1.5rem;
	line-height: 1.5;
	margin: 0.2rem 0 -0.4rem 0;
}
/* tab 曜日 */
.tab_item span{display: inline-block;}
.tab_item span:nth-child(2){display: none;}
.tab_item span:nth-child(3){display: none;}

@media print, screen and (min-width: 520px) {
  .tab_line { margin-top: 6px;}
  .tab_item { font-size: 1.8rem; }
  .tab_item::before { top: 15px; height: calc(100% - 30px); }
  .tab_item::after { left: 3px; bottom: -6px; width: calc(100% - 6px); height: 6px; }
  .tab_item span:nth-child(2){display: inline-block;}
  .tab_item_btn span:nth-child(2){display: inline-block;}
  .unit_flexbox li h3 { font-size: 1.6rem; line-height: 1.6; }

}
@media print, screen and (min-width: 960px) {	
  .tab_item { font-size: 2.0rem; padding: 2%; }
  .tab_item::after { left: 4px; width: calc(100% - 8px); }
  .tab_item span:nth-child(3){display: inline-block;}
	
  .unit_flexbox li h3 { font-size: 1.7rem;}
  .unit_flexbox li p{ font-size: 1.6rem; margin: 0.3rem 0 -0.4rem 0;}
  .unit_flexbox_ana li h3 { /*アナウンサー名*/ font-size: 2rem; }
}
/*イベントトップ用*/
.eventtop_list{margin-top: -4%;}
.eventtop_list_subtxt{margin-top: 4%;}
@media print, screen and (min-width: 520px) {
.eventtop_list{margin-top: -2.5%;}
.eventtop_list_subtxt{margin-top: 2.5%;}
}

/*番組サムネイル下のSNSリンクボタン--------------------------------*/
.sns_link_box{
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.area_ana .sns_link_box{
	justify-content: center;
}
.sns_link_box a{
	display: block;
	height: 32px;
	width: 32px;
	margin: 11px 15px 0 0;
	background-repeat: no-repeat;
	background-position: center;
}
.sns_link_box a:last-child{ margin: 11px 0 0 0; }

.sns_link_mail { 
	background-color: #d70b24;
	background-image: url("../../image/icon_btn_mail_w.svg");
	background-size: 15px auto;
	border-radius: 16px;
}
.sns_link_mail:hover { background-color: #ff3b3f; transition:0.1s;}

.sns_link_tw { background-image: url("../../image/account_x.svg"); background-size: 32px auto;}
.sns_link_x { background-image: url("../../image/account_x.svg"); background-size: 32px auto;}
.sns_link_fb{ background-image: url("../../image/account_fb.svg"); background-size: 32px auto;}
.sns_link_ig{ background-image: url("../../image/account_ig.svg"); background-size: 30px auto;}
.sns_link_note{ background-image: url("../../image/account_note.svg"); background-size: 27px auto;}
.sns_link_yt{ background-image: url("../../image/account_yt.svg"); background-size: 30px auto;}
.sns_link_line{ background-image: url("../../image/account_line.svg"); background-size: 30px auto;}
.sns_link_tiktok{ background-image: url("../../image/account_tiktok.svg"); background-size: 30px auto;}

@media (min-width: 960px) {
.sns_link_box a{ margin: 15px 15px 0 0; }
.sns_link_box a:last-child{ margin: 15px 0 0 0; }
}

/*サブスワイパー---------------------------------------------------------------------------*/

/*外枠組*/
.area_topindex_slider,
.area_sub_slider{ width:100%; max-width: 1560px; margin: 0 auto;}

/*スワイパー表示部分*/
.block_sub_swiper{ width: calc(96% + 9px); max-width: 1412px; margin: -3px -3px -3px auto; }

.block_topindex_swiper,
.block_topindex_swiper2{ width: calc(96% + 9px); max-width: 1412px; margin: 0 -3px -3px auto; }

.block_topindex_swiper,.block_sub_swiper{ padding: 6px 3px; }

/*見出し・ボタン*/
.top_sub_swiper_head{
	display: flex;
	justify-content: space-between;
	align-content: flex-end;
	align-items: center;
}
.swiper_top_link{
	margin-bottom: 1rem;
	display: none;
}
.swiper_bottom_link{
	margin-top: 1rem;
	display: block;
}
.swiper_bottom_link a{
	margin: 0 0 0 auto;
}

@media print, screen and (min-width: 520px) {
.swiper_top_link{ margin-bottom: 1.5%; }
.block_sub_swiper,
.block_topindex_swiper,
.block_topindex_swiper2{ width: calc(90% + 8px); margin: 0 auto; }
}

@media print, screen and (min-width: 768px) {
.swiper_top_link{ display: block; }
.swiper_bottom_link{ display: none;}
.area_sub_slider{ width: calc(100% - 8px);}
}

@media print, screen and (min-width: 960px) {
.block_sub_swiper,
.block_topindex_swiper,
.block_topindex_swiper2{ width: calc(90% + 12px); }
.block_topindex_swiper,.block_sub_swiper{ padding: 4px; }
	
.swiper_top_link{ margin-bottom: 1.2rem; }
}

.top_sub_swiper { position:relative; overflow: hidden }
.top_sub_swiper .swiper-pagination { display: none; }
.top_sub_swiper .swiper-wrapper { margin: 0 auto; }
.top_sub_swiper .swiper-slide img { width: 100%; }


/*矢印*/
.top_sub_swiper .swiper-button-next,
.top_sub_swiper .swiper-button-prev
{ display: none; }

@media print, screen and (min-width: 520px) {
.swiper-button-next,.swiper-button-prev{
position:absolute;
top:calc(50% - 20px);
width:18px;
height:40px;
z-index:10;
cursor:pointer;
background-size:20px 38px;
background-position:center;
background-repeat:no-repeat;}
	
.top_sub_swiper .swiper-button-next { display: inherit; right: calc(2.5% - 8px); }
.top_sub_swiper .swiper-button-prev { display: inherit; left: calc(2.5% - 8px); }
}
@media print, screen and (min-width: 960px) {
.swiper-button-next,.swiper-button-prev{
top:calc(50% - 22px);
width:27px;
height:44px;
background-size:27px 44px;}
}
@media print, screen and (min-width: 1405px) {
.top_sub_swiper .swiper-button-next { right: 2.5%; }
.top_sub_swiper .swiper-button-prev { left: 2.5%; }
}
/*中身共通---------------------------------------------------------------------------------*/
.block_topindex_swiper .swiper-slide,
.block_sub_swiper .swiper-slide{ 
	background: #fff;
	height: auto;
	border-radius: 5px;
}
.block_topindex_swiper .swiper-slide a,
.block_sub_swiper .swiper-slide a{ 
	display: flex;
	flex-wrap: wrap;
}

.block_sub_swiper .swiper-slide {padding-bottom: 2%;}
#article_list article {padding-bottom: 2%;}

.block_sub_swiper .swiper-slide img,
#article_list article img { margin-bottom: 3%; width: 100%; }

/*枠の影（ホバー含む）*/
.top_area_special_bigbox article ,
.block_topindex_swiper .swiper-slide ,
.block_sub_swiper .swiper-slide ,
#article_list article
{ background: #fff; box-shadow: 0px 0px 0px 3px rgba(0,0,0,0.02);}

.top_area_special_bigbox article:hover,
.block_topindex_swiper .swiper-slide:hover,
.block_sub_swiper .swiper-slide:hover,
#article_list article:hover { box-shadow: 0px 0px 0px 3px rgba(255,59,63,0.1); transition:0.1s;}

.block_sub_swiper .swiper-slide div:first-child {margin-bottom: 3%;}
#article_list article div:first-child {margin-bottom:  3%;}

@media print, screen and (min-width: 960px) {
.top_area_special_bigbox article ,
.block_topindex_swiper .swiper-slide ,
.block_sub_swiper .swiper-slide ,
#article_list article { box-shadow: 0px 0px 0px 4px rgba(0,0,0,0.02); border-radius: 7px;}
	
.top_area_special_bigbox article:hover,
.block_topindex_swiper .swiper-slide:hover,
.block_sub_swiper .swiper-slide:hover,
#article_list article:hover { box-shadow: 0px 0px 0px 4px rgba(255,59,63,0.1); transition:0.1s;}
}

/*タイトル部分(行数非表示)*/
article:hover .title { text-decoration: underline;}

/*ここからはサブトップのみの指定*/
.area_sub_slider article .title ,
#article_list article .title {
      overflow: hidden;
      width: calc(100% - 10%);
      margin:0 5%;
      font-size: 1.5rem;
	  font-weight: bold;
      max-height: calc(1.5rem * 1.6 * 3);
      line-height: 1.6;
      position: relative;
      display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
}

#info_swiper .title{ order:1; }

@media screen and (min-width: 520px) {
.area_sub_slider article .title ,
#article_list article .title
{ width: calc(100% - 10%);
    margin:0 5%;
	font-size: 1.6rem;
	max-height: calc(1.6rem * 1.6 * 3); }
}
@media screen and (min-width: 960px) {
.area_sub_slider article .title ,
#article_list article .title
{ width: calc(100% - 10%);
	margin:0 5% 0;
	font-size: 1.6rem;
	max-height: calc(1.6rem * 1.6 * 2);
	display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
}
}

/*日時・番組CMS名*/
.area_sub_slider .release_date,
#article_list .release_date,
.area_sub_slider .name,
#article_list .name {
	width: calc(100% - 10%);
	margin: 0 5% 0;
	font-size: 1.3rem;
	color: #868686;
	position:relative;
	text-indent: 10px;
	line-height: 1.4;
}

.area_sub_slider .release_date::before,
#article_list .release_date::before,
.area_sub_slider .name::before,
#article_list .name::before {
  content: '　';
  display: block;
  position: absolute;
  top: 0.6rem;
  left: 0px;
  width: 6px;
  height: 4px;
  background: #bebebe;
}

#article_list .release_date,
#article_list .name
{ margin-top: 0.4em; }

#info_swiper .release_date,
#info_swiper .name
{ margin-bottom: 0.3em;}

#event_swiper .release_date,
#event_swiper .name
{ margin-top: 0.4em; }

@media print, screen and (min-width: 520px) {
.area_sub_slider .release_date,
#article_list .release_date,
.area_sub_slider .name,
#article_list .name
{ font-size: 1.4rem; }

.area_sub_slider .release_date::before,
#article_list .release_date::before,
.area_sub_slider .name::before,
#article_list .name::before
{ top: 0.7rem; }
}

