@charset "utf-8";

/*---------------------------------------------
	Browser Default Initialization
  ---------------------------------------------*/
html {
font-size: calc((100vw - 320px) / 140 + 16px);
}


body {
	font-family: sans-serif,Meiryo ,Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ";
	-webkit-touch-callout:none;
}

img {
    border-style:none;  max-width: 100%;
	-ms-interpolation-mode: bicubic;
}
a img {
    border-style:none;
}

button {
    width: auto;
    padding:0;
    margin:0;
    background:none;
    border:0;
    font-size:0;
    line-height:0;
    overflow:visible;
    cursor:pointer;
}

h1 {
    margin-bottom:0;
}

h2 {
  font-size:0.9rem;
  padding: 0.3rem 0rem;
 position:relative;
 border-bottom: 6px solid #094;
}

h2:before {
  position: absolute;
  bottom: -6px;
  left: 0;
  width: 20%;
  height: 6px;
  content: '';
  background: #00cc5b;
}


h3{
font-size:0.9rem;
  position: relative;
  display: inline-block;
  padding: 0px;
  padding-bottom:20px;
  text-align: left;
  width:25%;
}


h3:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 10px;
  content: '';
  background-image: -webkit-repeating-linear-gradient(135deg, #00cc5b, #00cc5b 1px, transparent 2px, transparent 5px);
  background-image: repeating-linear-gradient(-45deg, #00cc5b, #00cc5b 1px, transparent 2px, transparent 5px);
  background-size: 7px 7px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}


h3:after {
  right: 0;
}


/*---------------------------------------------
	境界線用
  ---------------------------------------------*/
.line{
   border:solid #999999;
   border-width:1px 0 0 0;
   height:1px;/* for IE6 */
   clear:both;/* for IE6 */
   margin: 0; padding: 0;
   clear:both;
}


.line2{
   border:solid #cccccc;
   border-width:1px 0 0 0;
   height:1px;/* for IE6 */
   clear:both;/* for IE6 */
   margin: 0; padding: 0;
   clear:both;
}

.red{
   border:solid #e62e4f;
   border-width:2px 0 0 0;
   margin: 0; padding: 0;
   clear:both;
   width:570px;

}



@media(max-width:960px){.red{width:100%;}}
@media(max-width:768px){.red{width:100%;}}
@media(max-width:480px){.red{width:100%;}}


/*---------------------------------------------
	ヘッダー
  ---------------------------------------------*/

#head {
    display:flex;
    justify-content: space-between;
	width:100%;
	padding-top: 5px;
	margin: 0 auto;  
    text-align: left;

}

#head .note{
   padding-top: 30px;
}


@media(max-width:960px){#head{width:95%;text-align: center;} }
@media(max-width:768px){#head{width:95%;text-align: center;} }
@media(max-width:480px){#head{width:95%;text-align: center;} }


/*---------------------------------------------
	ヘッダーロゴ
  ---------------------------------------------*/

.logo {
	width:300px;
}


@media(max-width:960px){.logo{width:60%;}.logo img{width:100%;}}
@media(max-width:768px){.logo{width:60%;}.logo img{width:100%;}}
@media(max-width:480px){.logo{width:30%;margin-top:5px;}}
@media(max-width:320px){.logo{width:30%;margin-top:5px;}}



/*---------------------------------------------
	ダウンロード注意文
  ---------------------------------------------*/
#Annotation p {
	margin: 0 1em; 
	font-size: 1em;
} 
  
/*---------------------------------------------
	フッター
  ---------------------------------------------*/

#fotter
{
	width:100%;
    background-color: #3e3e3e; 
    float:left;
    clear:both;
    min-width:990px;

}



#fotter_in
{
	width:990px;
	margin: 0 auto;  
	padding: 10px 0px 10px 0px;
    background-color: #3e3e3e; 
    text-align: left;
    clear:both;


}


#fotter_in a:link { color: #d6d6d6;text-decoration: none;  }
#fotter_in a:visited { color: #d6d6d6; text-decoration: none;  }
#fotter_in a:hover { color: #d6d6d6; text-decoration: underline;  }
#fotter_in a:active { color: #d6d6d6; text-decoration: none;  }



@media(max-width:960px){#fotter,#fotter_in{width:100%;margin: 0 ;padding: 0;min-width:100%;} }
@media(max-width:768px){#fotter,#fotter_in{width:100%;margin: 0 ;padding: 0;min-width:100%;} }
@media(max-width:480px){#fotter,#fotter_in{width:100%;margin: 0 ;padding: 0;min-width:100%;} }

/*---------------------------------------------
	フッター下段
  ---------------------------------------------*/

#fotter_contact
{
    width: 100%; 
    clear:both;
    background-color: #272727; 
    color: #d6d6d6;
    min-width: 950px; 
     padding: 20px 0px 20px 0px ;


}




#fotter2_in
{
	width:950px;
	margin: 0 auto;  
	font-size: medium;
	background-color: #272727; 


}




#fotter2_in_l
{   width:300px;
	float:left;
}


#fotter2_in_l p
{
	
	text-align: right;
}

#fotter2_in_r p
{
	
	text-align: left;
}

#fotter2_in_r
{   width:600px;
    border-left: 1px solid #ffffff;
	padding: 0px 0px 0px 10px;
	margin:0px 0px 0px 10px;
	float:left;

}


#fotter2_in_cr
{
	width:750px; 
	margin: 0 auto; 
    padding: 10px 0px 50px 0px;
    clear:both;

}


#fotter2_in_cr p
{
    text-align: center;
    font-size: 60%;

}









@media(max-width:960px){#fotter_contact,#fotter2_in,#fotter2_in_cr{display: none;}}
@media(max-width:768px){#fotter_contact,#fotter2_in,#fotter2_in_cr{display: none;}}
@media(max-width:480px){#fotter_contact,#fotter2_in,#fotter2_in_cr{display: none;}}




#fotter3
{   width: 100%; 
    background-color: #272727; 
     
    display: none;
    text-align: left; 
    clear:both;
    margin: 0;
    padding: 20px 0px 20px 0px ;
}

#fotter3_in
{   width: 100%; 
    background-color: #272727; 
    
 
}


#fotter3_in h1
{   width: 70%; 
    color: #d6d6d6;  
    background-color: #272727; 
    font-weight: normal;
    font-size: 80%;
    
    
    
}


#fotter3_in p
{   width: 90%; 
    color: #d6d6d6; 
    background-color: #272727;  
    font-size: 80%;
}

#fotter3_cr
{   width: 100%; 
    background-color: #272727; 
    color: #d6d6d6; 

    
}


#fotter3_cr p
{   width: 90%; 
    color: #d6d6d6;  
    background-color: #272727; 
    font-size: 50%;
    margin-top: 10%;
    text-align: center;

}



#fotter3_in a:link { color: #d6d6d6;text-decoration: underline;  }
#fotter3_ina:visited { color: #d6d6d6; text-decoration: underline;  }
#fotter3_in a:hover { color: #d6d6d6; text-decoration: none;   }
#fotter3_in a:active { color: #d6d6d6; text-decoration: underline;}

@media(max-width:960px){#fotter3{display: block;}#fotter3_in h1{margin-left: 5%;}#fotter3_in p{margin-left: 5%;}#fotter3_cr p{margin-left: 5%;}}
@media(max-width:768px){#fotter3{display: block;}#fotter3_in h1{margin-left: 5%;}#fotter3_in p{margin-left: 5%;}#fotter3_cr p{margin-left: 5%;}}
@media(max-width:480px){#fotter3{display: block;}#fotter3_in h1{margin-left: 5%;}#fotter3_in p{margin-left: 5%;}#fotter3_cr p{margin-left: 5%;}}
@media(max-width:320px){#fotter3{display: block;}#fotter3_in h1{margin-left: 5%;}#fotter3_in p{margin-left: 5%;}#fotter3_cr p{margin-left: 5%;}}

/*---------------------------------------------
	メイン
  ---------------------------------------------*/

#main {
	width:100%;
	margin: 50px;  
}

#download {
	margin: auto 1em;  
}

#download01 {
	margin: auto 1em; 
	font-size: 1.5em;
}

#box1 {
 display:flex;
    right: 0;
    left: 0;

	width: 100%;
	float: left;	/* 左へ回り込み */
    font-size: 20px;
}
 
#box2 {
 display:flex;
 position: absolute;
    right: 0;


	width: 35%;
	float: left;	/* 左へ回り込み */
    display: flex;
    flex-direction: column;

  
}

.pict{
  margin-bottom:0rem;
}

@media(max-width:960px){.pict{width:60%;}.logo img{width:100%;}}
@media(max-width:768px){.pict{width:60%;}.logo img{width:100%;}}






#box3 {
	width: 75%;
	height: 50px;
    font-size: 40px;
     position: relative;

}

.title2{
font-size:1.3rem;
position: relative;
padding: 0rem;
text-align: left;
width:100%;

}

.title2::before,
.title2::after {
  content: '';
  position: absolute;
  top: 1rem;
  left: 0;
  width: 100%;
  height: 2px;

  background: #000;
}

.title2 span {
  position: absolute;
  left:0;
  padding: 0em;
  background: #fff;
  z-index:100;
}




.list-normal3-parts .list-parts {
 float:left;
}

figcaption {
font-size:0.5rem;
}


#overview {
width: 90%;
margin: 0 auto;
}

.parent {
	width:100%;
	height:5%;
	position: relative;
	margin: 0 auto;
	margin-bottom:0.8rem;
	display: inline-block;
	font-weight:bold;
	border-left: solid 3px #38b3f2;
	margin: 0 auto;
	padding: 5px 0 5px 5px;
}

.article{
position: relative;
margin: 0 auto;
}

#awardprogram{
width:90%;
margin: 0 auto;
}

.bangumi_article{
position: relative;
margin: 0 auto;
}

.table_setumei{
height: 15%;
position: relative;
margin: 0 auto;
padding:5px;
}

.anchor{
margin: 0 auto;

}

.media1{
position: relative;
height: 2rem;
margin: 0 auto;
margin-bottom:1.5rem;
}

.media2{
position: relative;
height: 2rem;
margin: 0 auto;
margin-bottom:1.5rem;
}


.media_box1{
position: absolute;
left: 0;
font-weight: bold;
padding: 0rem 0rem;
width:25%;

}

.media_box1::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 10px;
  content: '';
  background-image: -webkit-repeating-linear-gradient(135deg, #00cc5b, #00cc5b 1px, transparent 2px, transparent 5px);
  background-image: repeating-linear-gradient(-45deg, #00cc5b, #00cc5b 1px, transparent 2px, transparent 5px);
  background-size: 7px 7px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.media_box2{
position: absolute;
left: 0;
font-weight: bold;
padding: 0rem 0rem;
width:35%;
margin-left:0%;

}

.media_box2::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 10px;
  content: '';
  background-image: -webkit-repeating-linear-gradient(135deg, #00cc5b, #00cc5b 1px, transparent 2px, transparent 5px);
  background-image: repeating-linear-gradient(-45deg, #00cc5b, #00cc5b 1px, transparent 2px, transparent 5px);
  background-size: 7px 7px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}


.anchor_table{
border-collapse: collapse; /* 枠線を重ねない */
}


/*list-normal3-parts
---------------------------------------------------------------------------*/
/*-----放送ライブラリーで公開している受賞番組-----*/
@media screen and (min-width:768px)  { 

.list-normal3-parts {
    display:flex;
    right: 0;
    left: 0;
    margin: 0 auto;
}
}

@media screen and (max-width:576px) { 
.list-normal3-parts {
    display:flex;
    right: 0;
    left: 0;
    margin: 0 auto;
    flex-direction: column;
}
}
.list-normal3-parts .list-parts * {margin: 0;padding: 0;}

/*ボックス１個あたり*/
.list-normal3-parts .list-parts {
	position: relative;
	overflow: hidden;
  	padding: 1.5rem;	/*ボックス内の余白*/
	background: #fff;		/*背景色*/
	color: #555;			/*文字色*/
	border: 1px solid #ccc;	/*枠線の幅、線種、色*/
	margin-right: auto;
	margin-top: 1rem;
	margin-bottom: 1.5rem;
	margin-left: auto;


}

/*ボックス内のfigure画像*/
.list-normal3-parts .list-parts figure {
	margin-bottom: 1rem;	/*見出しの下に0.5文字分のスペースを空ける*/
}

/*ボックス内のh4見出し*/
.list-normal3-parts .list-parts h4 {
	font-size: 0.5rem;	/*文字サイズ130%*/
	margin-bottom: 0.5rem;	/*見出しの下に2文字分のスペースを空ける*/
    text-decoration: underline;
    color: blue;
}

/*ボックス内のp要素*/
.list-normal3-parts .list-parts p {
	font-size: 0.5rem;	/*文字サイズを90%*/
}

	/*画面幅768px以上の追加指定*/
	@media screen and (min-width:768px) {

	/*ボックス１個あたり*/
	.list-normal3-parts .list-parts {
		display: flex;	/*横並びにする*/
		gap: 1.5rem;	/*左の画像と右のテキストとの間のマージン的な余白*/
		width: fit-content;
		text-decoration: none;

	}
	
	/*ボックス内のfigure画像*/
	.list-normal3-parts .list-parts figure {
		margin-bottom: 0;	/*見出しの下のマージンをリセット*/
		width: 30%;			/*画像の幅*/
	}

	/*テキストを囲むブロック*/
	.list-normal3-parts .list-parts .text-parts {
		flex: 1;
	}

	}/*追加指定ここまで*/

	/*画面幅768px以下の追加指定*/
	@media screen and (max-width:768px) {

	/*ボックス１個あたり*/
	.list-normal3-parts .list-parts {
		display: flex;	/*横並びにする*/
		gap: 1.5rem;	/*左の画像と右のテキストとの間のマージン的な余白*/
	}
	
	/*ボックス内のfigure画像*/
	.list-normal3-parts .list-parts figure {
		margin-bottom: 0;	/*見出しの下のマージンをリセット*/
		width: 30%;			/*画像の幅*/
	}

	/*テキストを囲むブロック*/
	.list-normal3-parts .list-parts .text-parts {
		flex: 1;
	}

	}/*追加指定ここまで*/

.list-normal3-parts :hover {
  background-color: #DDFFFF;
}


/*-----番組テーマ-----*/

#theme {
width: 90%;
margin: 0 auto;
}

.selectlink2{ margin: 10px 0px; padding: 15px; border: 2px #ddd solid; border-radius: 3px; background-color: #fff; cursor: pointer; }
.selectlink2:hover{ border: 2px #333 solid; background-color: #eee; }

.selectlink3{ margin: 10px 0px; padding: 15px; border: 2px #ddd solid; border-radius: 3px; background-color: #fff; cursor: pointer; }
.selectlink3:hover{ border: 2px #333 solid; background-color: #eee; }

.wave {
	width: 50%;
	font-size: medium;
	text-align: center;
}

/*-----番組-----*/

#media {
width: 90%;
margin: 0 auto;
}

.bangumi_table a{
		width:100%;
		height:100%;
		display:block;" 
}


/*アイコン
---------------------------------------------------------------------------*/
/*共通*/
.list-normal3-parts .icon-bg1-parts,
.list-normal3-parts .icon-bg2-parts {
	overflow: hidden;
	position: absolute;
	left: 0px;		/*左からの配置場所*/
	top: 0px;		/*上からの配置場所*/
	font-size: 0.4rem;	/*文字サイズ。70%*/
	width: 7rem;		/*幅。10文字分*/
	padding-top: 1.5rem;	/*テキストの上にとる余白。2文字分。*/
	text-align: center;	/*テキストをセンタリング*/
	transform: rotate(-45deg) translate(-1.8rem,-3rem);	/*反時計回りに45度回転、X軸に-2.4文字分、Y軸に-3文字分移動。*/
}

/*icon-bg1-parts（サンプルだと「NEW」）*/
.list-normal3-parts .icon-bg1-parts {
	background: #ff3535;	/*背景色*/
	color: #fff;			/*文字色*/
}

.bangumi_syoukai{
margin:auto;
width:1180px;
}

.ban_table{
 margin:auto;

}

.bangumi_table {
	width:100%;
  margin-top:20px;
}

.clear {
  clear:both;
}


.bangumi_table td,th {
  border-collapse: collapse;
  font-size: 0.55rem;
  padding: 5px;
  height: 25px;
}

.bangumi_table th{
border-left: 1px solid #999999;
border-bottom: 1px solid #EEEEEE;
background-color: #EEEEEE;
}

.bangumi_table td{
border-bottom: 1px solid #BBBBBB;
}

.bangumi_table tr:hover td {
  background-color: #DDFFFF;
}

.bangumi_table tr:hover a {
  background-color: #b0c4de;
}

/*テーマ*/
.test-col-width-1 {
  width: 170px;
}
/*タイトル*/
.test-col-width-2 {
  width: 650px; 650
}
/*放送日*/
.test-col-width-3 {
  width: 105px;
  text-align: center;
}
/*分数*/
.test-col-width-4 {
  width: 55px; 55
}
/*ジャンル*/
.test-col-width-5 {
  width: 140px;
  
}
/*放送局*/
.test-col-width-6 {
  width: 150px; 150
}
/*ID*/
.test-col-width-7 {
  width: 100px; 100
}


/* ボタン全体 */
#page_top {
width: 60px;
height: 60px;
position: fixed;
right: 10px;
bottom: 10px;
background: #696969;
border-radius: 50%;
opacity: 0.6;
}

/* Font Awesome */
#page_top::before {
font-family: 'Font Awesome 5 Free';
font-weight: 900;
content: '\f102';
font-size: 30px;
color: #ffffff;
position: absolute;
top: 50%;
left: 50%;
translate: -50% -50%;
}

html{
  scroll-behavior: smooth;
}