/* ----------------------------

File Name:  styles.css
Last Update:2021-02-28

---------------------------- */

@charset "utf-8";

@-ms-viewport {width: device-width;}

/* http://meyerweb.com/eric/tools/css/reset/ 
v2.0 | 20110126
License: none (public domain)
*/
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, img, ins, kbd, q, s, samp, small, strike, strong, 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-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section  {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
/* base
   ========================================================================== */

html { -webkit-font-smoothing: antialiased; font-size: 60%;}

body {
	font-size: 1.6rem;
	line-height: 1.6;
	background: #ffcc00 url(../image/back_body.png) ;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

header, div, section, p, img, li, footer {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

a:link
{ color: #C00; text-decoration: none;}
a:visited
{ color: #630; text-decoration: none;}
a:hover
{ color: #FF6600; text-decoration: none;}
a:active
{ color: #FF0000; text-decoration: none;}

/* グローバルメニュー表示 */
.gm {}

/* グローバルメニュー非表示 */
@media only screen and (max-width: 767px) {
.gm {display: none;}
}

  .pc { display:block; }
  .smp { display: none; }

@media screen and (max-width: 540px) {

.smp { display: block; }
.pc { display: none; }
}


/*header------------------------------------------*/

header {
	width:100%;
	margin:0 auto;
	text-align:center;
	background:#860305;
	line-height: 0;
	border-bottom: #000 5px solid;
}

header img {
	width:100%;
}

.titleimg_s{ display:none;}
.titleimg_l{ display:block; margin: 0px auto}

@media only screen and (max-width: 767px) {
.titleimg_s{ display:block;}
.titleimg_l{ display:none;}
}
.top-title { display:none}

.hide_txt{display: none}
/* Page------------------------------------------*/

.main{
  margin: 0;
  padding: 4% 0 0;
  width: 100%;
  background:url(../image/back_main.png) repeat-y center top -60px;
}

@media (max-width: 1080px) {
	.main{
		background:url(../image/back_main.png) repeat left -1600px top -20px;
		background-size: auto;}
}

.unit{ 
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width:92%;
  max-width:920px;
  margin: 4% auto 0;
}

.top.unit { 
  margin: 0 auto 0;
}

.wap_box {
	width:49%;
}

.wap_box_l {
	width:100%;
	text-align: center;
}
.wap_box_l img {
	margin: 0 auto 3%;
	max-width: 300px;
}

.border_box{
	border: #000 6px solid;
	background: #ffffff;
	padding: 3%;
}

.info_box {
	width:100%;
	background-color: #ffffff;
	background-image: url(../image/back_infobox_top.png),url(../image/back_infobox.png);
	background-repeat: no-repeat,repeat-y;
	background-position: top -0% left -3% , right;
	background-size: 20%,auto;
	margin-bottom: 3%;
}

.area_box {
	width:100%;
	background-color: #ffffff;
	background-image: url(../image/back_infobox_top_area.png),url(../image/back_infobox.png);
	background-repeat: no-repeat,repeat-y;
	background-position: top -0% left -3% , right;
	background-size: 20%,auto;
}

.info_box h5 {margin-bottom: 2%;}
.info_box h6 {font-weight:  bold;}

.info_box_main {
	padding: 0 0 0 20%;
}

.info_box_photo{
	display: flex;
	margin: 10px 0 0 ;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
}

.info_box p{
	margin: 0 0 20px;
}

.info_box_photo img ,.info_box_photo p{ 
	width: 48%;
	padding: 0;
}

.box_onair{
	background: #ffffff url(../image/back_onair.png) repeat-x;
	background-size: 100%;
	padding: 14% 3% 3% 3%;
}
.box_twitter{
	background: #ffffff url(../image/back_twitter.png) no-repeat;
	background-size: 100%;
	padding: 17% 3% 3% 3%;}

/* スマホ対応用 */

@media (max-width: 767px) {

	.wap_box{width: 100%;}

	.unit{width: 96%; margin: 3% auto}
	
	.info_box {	background-size: 30%,auto;}

	.info_box_main  {padding: 0 0 0 30%;}

	.box_onair{
	margin: 0 0 4% ;
	padding: 28% 3% 3% 3%;
}
	.box_twitter{
	padding: 34% 3% 3% 3%;}
}

@media (max-width: 400px) {
	.info_box_info {	
		background-position: top -1% left -6% , right;
		background-size: 100px ,100px;
}
	.area_box {	
		background-position: top center , right;
		background-size: 120px ,auto;
}
	.info_box_main {padding: 65px 0 0;}

	.info_box_photo img ,.info_box_photo p{ 
	width: 100%;
	padding: 0;
}
}

/* 見出し・テキスト------------------------------------------*/

h4 {/*見出し*/ 
	font-size: 1.4em;
	font-weight:bold;
	color: #000000;
	text-shadow:1px 1px 0 #ff92fb;
}

h5 {/*見出し*/ 
	display: block;
	font-size: 1.4em;
	font-weight:bold;
	color: #000000;
	text-shadow:1px 1px 0 #ff92fb;
}

p {/*本文*/ 
	line-height:160%;
	margin:20px 0;
}

.btn{/*ボタン*/ 
	margin: -15px 0 15px ;
	padding:8px 15px 4px;
	display:inline-block;
	color:yellow;
	text-decoration: none;
	background: #000;
	border-radius: 20px;
	font-weight: bold;
}

.btn:last-child{margin: -15px 0 0 ; }
.btn:link , .btn:visited{ color: yellow; }
.btn:hover{ background: red; }

/*お知らせ見出し*/
.info_new{
	font-size: 1.2em;
	font-weight:bold;
	margin: 0 0 0.5em 0;
}

/*ゲスト*/
.guest { height: 30px; display: block; margin: 0 auto 1%;}

/*日付*/
.onair_day {
	text-align: center;
	line-height: 1.0em;
}
.onair_day_l {
	font-size: 1.4em;
}

/*放送局*/

.border_box table{
	width: 100%;
	max-width: 360px;
	background: #000;
	border: solid 3px #000;
}

.border_box th , .border_box td{
	padding: 5px 10px;
	box-sizing: border-box;
	background: #fff;
	text-align: left;
	font-weight: bold;
}
.border_box tr{border: solid 1px #000;}
.border_box th{width: 35%;border-right: solid 1px #000; background: #fff100;}
.border_box td{width: 65%;}

@media only screen and (max-width: 480px) {
.border_box th , .border_box td{
	display: block;
	width: 100%;
}
.border_box th {border-right: none ;border-bottom: solid 1px #000;}
}

/* 写真------------------------------------------*/

.photo_box{ 
	margin: 20px 0 -30px 0;
	padding:0;
}

/* twitter------------------------------------------*/
.tw_box{ margin: 20px auto 0;}
.twitter-timeline { width: 740px !important; }

/*TVER------------------------------------------*/
.tver {
  margin: 4% auto 0 auto;
}
.tver .wap_box {
  line-height: 0;
  align-self: center;
}
.tver a {
  display: block;
}
.tver a:hover{
  text-decoration: none;
  opacity: 0.8;
}
.tver_txt { text-align: center}
.tver_day { 
	background: #000;
	color: #fff;
	padding: 10px;
	margin: 20px 0 ;
	border-radius: 30px;
}
.tver_link { width: 100%}
.tver_title { width: 70%;}

/*アイコン付きサムネイル*/

.play_icon {
	display: block;
	position: relative;
}

.play_icon:after {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	width: 100%;
	height: 100%;
	background: url(../image/play_movie.png)no-repeat center center;
	background-size: 20% auto;
}

/*movie Youtube*/
.info_video {
	max-width: 480px;
	margin-bottom: 20px;
}
.video {
	position: relative;
	padding: 0 0 56.25%;
}
.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* footerにスマホトップへ戻る画像を追加
   ========================================================================== */
.hbc-back {
    width: 130px;
    margin: 0 auto;
    padding: 10px;
	display: none;
}
.hbc-back img {
    width: 100%;
}

@media only screen and (max-width: 767px) {
.hbc-back {
    display: block; 
}
}


/* Footer ------------------------------------------------------------------*/

footer { 
	width: 96%;
	max-width: 920px;
	margin: 4% auto 0;
	border-top: #000 6px solid;
	border-left: #000 6px solid;
	border-right: #000 6px solid;
	padding: 3%;
	background: #ffffff url(../image/back_footer.png) repeat-x;
}
/* Youtube
------------------------------------------*/

.link_youtube {
	border: #000 6px solid;
	background: #ffffff;
	line-height: 0;
}

.link_youtube img {
	width: 100%;
	image-rendering: -webkit-optimize-contrast;
}

/* バナー
------------------------------------------*/

.link_bn {
	width:92%;
	max-width:920px;
	margin: 0 auto 4%;
	line-height: 0;
}

.link_bn img {
	width: 100%;
}
	
/* Linkリスト
------------------------------------------*/

.link_list {
  width:50%;
  margin:auto;max-width:400px;
}

.link_list ul {
	margin: 0;
	padding: 0;
}

.link_list li {
	list-style:none;
	margin:0 auto 30px;
	border: solid #000 5px;
	line-height: 0;
}

.link_b{ width:100%;
	padding:0;
	margin:0 auto; }
	
	
/* コピーライト
------------------------------------------*/

address {
	padding:10px 3px;
    font-style: normal;
	text-align:center;
}