@charset "utf-8";
@-ms-viewport {width: device-width;}
/* ----------------------------

File Name:  styles.css
Last Update:2018-06-22

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

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
   ブラウザデフォルトCSSクリア
*/

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%;
  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;
}
blockquote, q {
  quotes: none;
}
blockquote::before, blockquote::after,
q::before, q::after {
  content: '';
  content: none;
}

/* Base
------------------------------------------*/

html { -webkit-font-smoothing: antialiased; }

body {
	margin: 0;
	color: #252525;
	background: #ffffff;
	font-size: 87.5%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
}
@media (max-width: 980px) {/* タブレット用文字縮小 */
	body {font-size: 81.25%;}
}

/*リンクテキスト*/
a:link{ color: #393939; text-decoration: none;}
a:visited{ color: #393939; text-decoration: none;}
a:hover{ color: #393939; text-decoration: none;}
a:active{ color: #393939; text-decoration: none;}


.top_txt_linkbold{/*リンク強調用テキスト*/
	padding-right: 5px;
	color: #08278c;
	font-weight:600;
	text-decoration:none;
}

a:hover .top_txt_linkbold{
	text-decoration:underline;

}

a:hover .top_txt_nohover {/*hoverなし*/
	color: #393939;
}

@media (max-width: 767px) {/* グローバルメニュー&フッター表示・非表示 */
	.menu_display{ display: none;}
}

/* スマホ用フッターリンク */
.go_smp{ display: none; }

@media (max-width: 767px) {/* スマホ用フッターリンク・表示 */
	.go_smp{
	display: block;
    width: 130px;
    margin: 0 auto 30px auto;
    background: #fff;
    padding: 10px;
}
}

/* 見出し-----------------------------------------------*/

/*見出し文字・基本*/
.h_font{/*border: solid 1px #333; */
	position: relative;
	padding: 0 0 10px 0;
	margin: 0 0 10px 0;
	box-sizing: border-box;
	font-family: '游ゴシック体', 'Yu Gothic', YuGothic, sans-serif;
	font-size: 26px;
	font-weight: 500;
}

@media (max-width: 980px) {/* ナビ文字縮小 */
	.h_font {font-size: 22px;}
}
@media (max-width: 768px) {/* ナビ文字縮小 */
	.h_font {font-size: 18px;}
}	

/* 隠し文字(非表示用)*/
.hide_txt{display:none;}

/*見出し文字・色*/
.h_blue{color: #2f4aa0;}
.h_skyblue{color: #508eb1;}
.h_darkgreen{color: #36413b;}
.h_aqua{color: #399edf;}

.h_sub_gray ,
.h_sub_black ,
.h_sub_white{/*アルファベット部分*/
	margin: 0 0 0 10px ;
	padding: 10px 10px;
	line-height: 26px;
	font-size: 14px;
}
.h_sub_gray{ color:#bfc5c8 ;}
.h_sub_black{color:#8aa293 ;}
.h_sub_white{color:#ffffff ;}
.h_sub_dark_green{color:#8aa293;}

/*アイコン指定（aは平行四辺形・bは長方形）*/
.top_icon_a { height: 9px; vertical-align:middle; padding: 0 10px 0 0;}
.top_icon_b { width:10px; vertical-align: 5px; padding: 0 10px 0 0;}
.top_icon_mail { width:16px; vertical-align: 5px; padding: 0 10px 0 0;}

/*サブトップ用見出し*/
.sub_h_txt{/*border: solid 1px #000;*/
	width: 100%;
	position: relative;
	display: block;
	box-sizing: border-box;
	padding: 0;
}
.sub_h_txt span{ 
	padding: 0 5px 0 0;
	background: #ffffff;}

.sub_h_txt span::after{
	content: '';
	position: absolute;
	top: 0;
	display: inline-block;
	width: 10px;
	height: 30px;
	background-color: #fff;
	-webkit-transform: skewX(150deg);
	-moz-transform: skewX(150deg);
	transform: skewX(150deg);
	z-index:-3;
}
/*サブ見出し・背景ライン*/
.sub_h_tv ,.sub_h_radio ,
.sub_h_event ,.sub_h_ana ,
.sub_h_news ,.sub_h_monsuketv
{z-index:-2;}

.sub_h_tv{background: url(../image/h_back_sub_tv.png) no-repeat center right;}
.sub_h_radio{background: url(../image/h_back_sub_radio.png) no-repeat center right;}
.sub_h_event{background: url(../image/h_back_sub_event.png) no-repeat center right;}
.sub_h_ana{background: url(../image/h_back_sub_ana.png) no-repeat center right;}
.sub_h_news{background: url(../image/h_back_sub_news.png) no-repeat center right;}
.sub_h_monsuketv{background: url(../image/h_back_sub_monsuketv.png) no-repeat center right;}


/*ヘッダ　header------------------------------------------*/

header{
}

.header_topindex{
	z-index: 1;
	background: #d4473c;
	padding: 30px;
	min-width: 768px;
	box-sizing: border-box;
	box-shadow: 0px 8px 8px -1px rgb(193,65,55) inset, 0px -8px 8px -1px rgb(193,65,55) inset;
}


/*サブトップ用タイトル------------------------------------------------------------*/

.header_subtop{
	min-width: 768px;
	z-index: 1;
	background: #d4473c;
	padding: 15px 30px;
	box-sizing: border-box;
}

.subtop_title{/*ヘッダ文字*/
	width: 100%;
	max-width: 1220px;
	margin: auto;
	padding: 0 20px ;
	border-left: solid 5px #ffffff;
	box-sizing: border-box;
	color: #ffffff;
	font-size: 28px;
	font-weight: 500;
}

.subtop_title_alphabe{/*ヘッダ英文字*/
	padding: 0 15px ;
	vertical-align:middle;
	font-size: 18px;
	font-weight: normal;
}
.newspage_head_foot{/*ニュース個別ページ用*/
	min-width: 100%;
}

/* 新着コーナー(TOP・サブ共通)------------------------------------------*/
div#whatsnewContainer {}

.whats_new_list{
	background: #ffffff;
	border: solid 3px #e2e2e2 ;
	overflow-y:scroll;
	overflow:auto;
	box-sizing: border-box;
}

/* トップindex用 */
.whats_new_topindex{ height:34vw; max-height:400px; }

/* サブトップ用 */
.whats_new_subtop{ height:160px; margin-bottom: 40px; }

/* もんすけTVトップ用 */
.whats_new_monsuketv{ height:240px; margin-bottom: 40px; }

/* 共通 */
.whats_new_list ul{height: auto;}

.whats_new_list li{
	list-style: none;
	border-bottom: dotted 1px #e2e2e2 ;
}
.whats_new_list a{ 
	display: block;
	width: 100;
	box-sizing: border-box;
	padding: 15px;
}
.whats_new_day{
	margin-bottom: 4px;
	font-size: 10px;
	color: #979797;
}

.whats_new_txt{ line-height: 1.8; }

/*新着・カテゴリラベル*/
.whats_new_event ,
.whats_new_bangumi ,
.whats_new_present ,
.whats_new_bosyu ,
.whats_new_press ,
.whats_new_info { 
	margin: 0 5px 0 0 ;
	padding: 2px 5px ;
	font-size: 10px;
	color: #ffffff;
}

.whats_new_event{ background:#ea8099; }
.whats_new_bangumi{ background:#4aaf5f; }
.whats_new_present{ background:#fa9e27; }
.whats_new_bosyu{ background:#64a5ed; }
.whats_new_press{ background:#5a6cbd; }
.whats_new_info{ background:#b482d1; }


/* ツイッター枠------------------------------------------*/
div#twitterContainer {
	width: 100%;
	max-width: 390px;
}

.twitter_mainbox {
	width: 100%;
	max-width: 390px;
	border: solid 3px #e3e3e3;
	box-sizing: border-box;
	overflow: hidden;
}

.button_HBCtwitter{
	display: none;
}
.twitter_hide{ display: inherit;}

@media (max-width: 768px) {/* タブレット用文字縮小 */

.twitter_hide{ display: none;}

/*twitterボタン(縮小用)*/
.button_HBCtwitter{
	display:inherit;
	width: 100% ;
	margin-top: -30px;
	border-radius: 5px;
}
.button_HBCtwitter  a:hover{opacity: 0.8;}
}	

/* 動画------------------------------------------*/
.video {
	margin: 1em auto ;
	position: relative;
	height: 0;
	padding: 0 0 56.25%;
	overflow: hidden;
}
.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* バナースペース ------------------------------------------------------------------*/

/* バナーリスト共通 */
.banner_list{
	display: flex;
	flex-wrap: wrap;
	justify-content:flex-start;
	list-style: none;
	width: 100%;
}

.banner_list img{
	border: solid 1px #d6d6d6;
	width: 100%;
	box-sizing: border-box;
}

/* トップindex用 */
.top_banner_space {
	margin:0;
	width: 100%;
	min-width: 768px;
	padding: calc(40px - 0.7%) 0 0 0;
	box-sizing: border-box;
	background: #e4e4e4;
}

.top_banner_space li{margin-top:1%; margin-right:1%}
.top_banner_space li:last-of-type{ margin-right: 0;}

/* サブトップ用 */
.sub_banner_space {
	width: 100%;
	padding: 5px ;
	box-sizing: border-box;
	background: #e4e4e4;
}
.sub_banner_space ul{
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	box-sizing: border-box;
}
.sub_banner_space li{
	box-sizing: border-box;
	margin: 3%;
	width: 44%;
}
.sub_banner_space li.large{
	width: 94%;
	margin: 3%;
}

/* クリアフィックス(回り込み解除旧IE対応)--------------------------*/
.clearfix::after {
    content: '';
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}
.clearfix {
    zoom: 1; /* for IE6/7 */
}
/* ad */
.ad {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 30px 0;
}