/*	reset
============================== */
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,main {margin:0;padding:0;border:0;font-size:100%;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main {display:block;}
body {font-family:Verdana,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;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;}
wbr:after {content:"\00200B";}

/*	TBS reset
============================== */
.alt {position:absolute;top:-5000px;left:-9999px;}
.clearfix:after {content:"";clear:both;display:block;}
.hide-txt {text-indent:110%;white-space:nowrap;overflow:hidden;}
.fp-causion {display:none;}
.nocontxt {-webkit-touch-callout: none;-webkit-user-select: none;user-select: none;-webkit-user-drag:none;}
.nocontxt img {pointer-events: none;}
@media all and (min-width:768px) {
.alt-pc {position:absolute;top:-5000px;left:-9999px;}
.clearfix-pc:after {content:"";clear:both;display:block;}
.hide-txt-pc {text-indent:110%;white-space:nowrap;overflow:hidden;}
}
@media all and (max-width:767px) {
.alt-smp {position:absolute;top:-5000px;left:-9999px;}
.clearfix-smp:after {content:"";clear:both;display:block;}
.hide-txt-smp {text-indent:110%;white-space:nowrap;overflow:hidden;}
}
div.embed-tbsplayer {
background-color:#000;
position:relative;
height:0;
padding-top:56.25%;
}
div.embed-tbsplayer .tbs-player {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
}
div.embed-tbsplayer-audio {
background-color:#fff;
}
div.embed-tbsplayer-audio .tbs-player {
height:46px;
}
div.lbx-overlay {
z-index:10000;position:absolute;background-color:#000;width:100%;height:100%;left:0;top:0;right:0;bottom:0;opacity:0.9;
}


/*	both
============================== */
#wrapper{
	width: 100%;
}
img{
	vertical-align:bottom;
}
.cleartext {
	text-indent:200%;
	white-space:nowrap;
	overflow:hidden;
}
li{
	list-style: none;
}
li a{
    display: block;
    height: 100%;
    width: 100%
}
a img{
    display: block;
    height: 100%;
    width: 100%
}
.img_ad{
	width: 100% !important;
	height: auto !important;
}

@media all and (min-width: 768px) {
	.pc-none{
		display: none;
	}
	.br-pc {
		display:block;
	}
	.br-sp {
		display:none;
	}
	.link{
		transition-duration: 0.2s;
	}
	.link img{
	  cursor: pointer;
	}
	.link:hover{
	  transform: translateY(2px);
	  transition-duration: 0.2s;
	}
}

@media all and (max-width: 767px) {
	.sp-none{
		display: none;
	}
	.br-pc {
		display:none;
	}
	.br-sp {
		display:block;
	}
	.tbs-gfooter-btn{
		z-index: 9997 !important;
	}
	.tbs-gfooter-share{
		z-index: 9996 !important;
	}
}

/*	text
============================== */
body {
  font-family: Verdana,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  word-break: break-all;
  color:#231815;
}
.serif{
	font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}
a:link {
	text-decoration:none;
	color:#231815;
}
a:visited {
	text-decoration:none;
	color:#231815;
}
a:hover {
	text-decoration:underline;
	color:#231815;
}
a:active {
	text-decoration:underline;
	color:#231815;
}
.page-text a:link {
	text-decoration:underline;
	color:#ff66b3;
	font-weight: bold;
}
.page-text a:visited {
	text-decoration:underline;
	color:#ff66b3;
	font-weight: bold;
}
.page-text a:hover {
	text-decoration:none;
	color:#231815;
	font-weight: bold;
}
.page-text a:active {
	text-decoration:none;
	color:#231815;
	font-weight: bold;
}
.copyright{text-align: center;}
.copyright a:link{color:#231815; text-decoration:none}
.copyright a:visited{color:#231815; text-decoration:none}
.copyright a:active{color:#231815; text-decoration:none}
.copyright a:hover{color:#231815; text-decoration:none; opacity: 0.6; filter: alpha(opacity=60); -ms-filter: "alpha(opacity=60)"; transition:all 0.5s ease;
}

/*	background
============================== */


/*retina*/
@media only screen and (min-width: 768px) and (-webkit-min-device-pixel-ratio: 2) {

}
@media only screen and (max-width: 767px) and (-webkit-min-device-pixel-ratio: 2) {

}


/* =====================================
	USER css
====================================== */

/*	color
============================== */
.color01{
	color:#ffcc00 !important;
}
.color02{
	color:#996696 !important;
}
.color03{
	color:#0099ff !important;
}
.color04{
	color:#99cc00 !important;
}
.color05{
	color:#ff0000 !important;
}
.color06{
	color:#ff66b3 !important;
}

/*	border
============================== */
.border1px{
	border: 1px solid #231815;
}
.border2px{
	border: 2px solid #231815;
}


/*	shadow
============================== */
.shadow01{
	filter: drop-shadow(0px 4px 4px #aaa);
}
.shadow02{
	filter: drop-shadow(0px 0px 10px #231815);
}
.shadow03{
	filter: drop-shadow(0px 4px 4px #fff);
}

/* ボタン共通設定 */
.btn03{
    /*影の基点とするためrelativeを指定*/
    position: relative;
    /*ボタンの形状*/
	text-decoration: none;
	display: inline-block;
    text-align: center;
    background: transparent;
	border: solid 1px #231815;
    outline: none;
    /*アニメーションの指定*/
    transition: all 0.2s ease;
}

/*hoverをした後のボタンの形状*/
.btn03:hover{
	border-color:transparent;
	text-decoration: none;
}

/*ボタンの中のテキスト*/
.btn03 span {
	position: relative;
	z-index: 2;/*z-indexの数値をあげて文字を背景よりも手前に表示*/
    /*テキストの形状*/
	display: block;
    padding: 10px 30px;
	background:#fff;
	color:#231815;
    /*アニメーションの指定*/
    transition: all 0.3s ease;
}

/*== 下に押し込まれる（立体が平面に） */

/*影の設定*/
.pushdown:before {
    content:"";
    /*絶対配置で影の位置を決める*/
    position: absolute;
	z-index: -1;
    top:4px;
    left:0;
    /*影の形状*/
    width: 100%;
    height: 100%;
    background-color: #231815;
}

/*hoverの際にY軸に4pxずらす*/
.pushdown:hover span {
	background-color: #231815;
	color: #fff;
	transform: translateY(4px);
	text-decoration: none;
}


/* =====================================
	HEADER MENU
====================================== */

/*========= ナビゲーションのためのCSS ===============*/
#g-nav{
	/*position:fixed;にし、z-indexの数値を小さくして最背面へ*/
	position:fixed;
	z-index: -1;
	opacity: 0;/*はじめは透過0*/
	/*ナビの位置と形状*/
	top:0;
	width:100%;
	height: 100vh;/*ナビの高さ*/
	/*background:#999;*/
	background: url("../img/menu_bg.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;

	/*動き*/
	transition: all 0.3s;
}

/*アクティブクラスがついたら透過なしにして最前面へ*/
#g-nav.panelactive{
	opacity: 1;
	z-index:9999;
}
/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list{
	/*ナビの数が増えた場合縦スクロール*/
	position: fixed;
	z-index: 9999; 
	width: 100%;
	height: 100vh;/*表示する高さ*/
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}

/* 新しいコンテナのスタイル */
.nav-content {
	display: flex;
	flex-direction: column;
	align-items: center; /* 中央揃え */
	justify-content: center; /* 縦方向の中央揃え */
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

/*ナビゲーション*/
/* 初期状態では非表示 */
#g-nav ul {
	display: none;
}
/* パネルがアクティブなときに表示 */
#g-nav.panelactive ul {
	display: grid; /* グリッドレイアウトを適用 */
	grid-template-columns: repeat(2, auto); /* 横2列に配置 */
	grid-gap: 20px; /* 要素間の間隔 */
	list-style: none;
	padding: 0;
	margin: 0;
}
/*リストのレイアウト設定*/
#g-nav li {
	list-style: none;
	text-align: center;
}
#g-nav li a{
	color: #333;
	text-decoration: none;
	padding:10px;
	display: block;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-weight: bold;
}

.menu-logo{
	background: url("../img/top_logo.png") no-repeat;
}
.menu_list{
	background-position: top center;
}
.menu_news{
	background: url("../img/menu_news.jpg") no-repeat;
}
.menu_onair{
	background: url("../img/menu_onair.jpg") no-repeat;
}
.menu_intro{
	background: url("../img/menu_introduction.jpg") no-repeat;
}
.menu_staffcast{
	background: url("../img/menu_staffcast.jpg") no-repeat;
}
.menu_music{
	background: url("../img/menu_music.jpg") no-repeat;
}
.menu_character{
	background: url("../img/menu_character.jpg") no-repeat;
}
.menu_novelty{
	background: url("../img/menu_novelty.jpg") no-repeat;
}
.menu_goods{
	background: url("../img/menu_goods.jpg") no-repeat;
}
.menu_event{
	background: url("../img/menu_event.jpg") no-repeat;
}
.menu_disc{
	background: url("../img/menu_disc.jpg") no-repeat;
}
.menu_story {
    background: url(../img/menu_story.jpg) no-repeat;
}
.closebtn1{
	background: url("../img/btn_menuclose@2x.png") no-repeat;
}

@media all and (min-width: 768px) {
	.menu-area{
		height: 0;
		position: sticky;
		top: 0;
		z-index: 1;
	}
	.menu{
		width: 10%;
		max-width: 150px;
		padding: 3%;
		position: absolute;
		right: 0;
	}
	.menu img{
		width: 100%;
	}
	.menu_list{
		margin: 0 auto 24px;
	}
	.menu-logo{
		width: 640px;
		height: 123px;
		background-size: contain;
		margin: 0 auto 10%;
	}
	.menu_news{
		width: 158px;
		height: 55px;
		background-size: contain;
	}
	.menu_onair{
		width: 174px;
		height: 60px;
		background-size: contain;
	}
	.menu_intro{
		width: 356px;
		height: 62px;
		background-size: contain;
	}
	.menu_staffcast{
		width: 290px;
		height: 61px;
		background-size: contain;
	}
	.menu_music{
		width: 174px;
		height: 60px;
		background-size: contain;
	}
	.menu_character{
		width: 290px;
		height: 61px;
		background-size: contain;
	}
	.menu_novelty{
		width: 240px;
		height: 75px;
		background-size: contain;
	}
	.menu_goods{
		width: 174px;
		height: 60px;
		background-size: contain;
	}
	.menu_disc{
		width: 158px;
		height: 55px;
		background-size: contain;
	}
	.menu_story{
        width: 160px;
        height: 75px;
        background-size: contain;
    }
	.menu_event {
        width: 160px;
        height: 75px;
        background-size: contain;
    }
	.closebtn1{
		width: 390px;
		height: 60px;
		background-size: contain;
		margin: 60px auto 0;
	}
	
}

@media all and (max-width: 767px) {
	#g-nav.panelactive ul {

    }
	.menu-area{
		height: 0;
		position: sticky;
		top: 0;
		z-index: 1;
	}
	.menu{
		width: 12%;
		padding: 2%;
		position: absolute;
		right: 0;
	}
	.menu img{
		width: 100%;
	}
	.menu_list{
		margin: 0 auto 0em;
	}
	.menu-logo{
		width: 290px;
		height: 56px;
		background-size: contain;
		margin: 0 auto 8%;
	}
	.menu_news{
		width: 79px;
		height: 27px;
		background-size: contain;
	}
	.menu_onair{
		width: 87px;
		height: 30px;
		background-size: contain;
	}
	.menu_intro{
		width: 178px;
		height: 31px;
		background-size: contain;
	}
	.menu_staffcast{
		width: 145px;
		height: 30px;
		background-size: contain;
	}
	.menu_music{
		width: 87px;
		height: 30px;
		background-size: contain;
	}
	.menu_character{
		width: 145px;
		height: 30px;
		background-size: contain;
	}
	.menu_novelty{
		width: 120px;
		height: 38px;
		background-size: contain;
	}
	.menu_goods{
		width: 87px;
		height: 30px;
		background-size: contain;
	}
	.menu_disc{
		width: 79px;
		height: 27px;
		background-size: contain;
	}
	.menu_story{
		width: 81px;
		height: 38px;
		background-size: contain;
	}
	.menu_event{
		width: 81px;
		height: 38px;
		background-size: contain;
	}
	.closebtn1{
		width: 230px;
		height: 75px;
		background-size: contain;
		margin: 1em auto 0;
	}

}


/* =====================================
	FOOTER
====================================== */

.footer-wrap{
	background: #ffffff;
}
.footer-banner img,
.footer-logo img{
	width: 100%;
}
.footer-banner-link img{
	width: 100%;
}


@media all and (min-width: 768px) {
	.footer-wrap{
		box-shadow: 0px -20px 30px 0px rgb(0 0 0 / 20%); 
		padding: 60px 0 80px;
	}
	.footer-wrap h4{
		font-size: 24px;
		margin: 0 0 5px 5px;
	}
	.footer-inner{
		width: 980px;
		margin: 0 auto;
	}
	.footer-banner-wrap{
		display: flex;
		justify-content: space-between;
	}
	.fotter-sns-block{
		width: 390px;
¥	}
	.fotter-link-block{
		width: 560px;
	}
	.footer-ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.footer-banner{
		border: 2px solid #231815;
	}
	.footer-banner-sns{
		width: 386px;
		margin: 5px 5px 24px;
	}
	.footer-banner-link{
		width: 266px;
		height: 78px;
		margin: 5px;
	}
	.footer-logo{
		width: 500px;
		margin: 48px auto 32px;
	}
	.copyright{
		font-size: 12px;
		font-weight: bold;
		line-height: 1.8em;
		letter-spacing: 0.1em;
	}
}

@media all and (max-width: 767px) {
	.footer-wrap{
		box-shadow: 0px -20px 30px 0px rgb(0 0 0 / 20%); 
		padding: 2em 0 6em;
	}
	.footer-wrap h4{
		font-size: 1em;
		margin: 0 0 5px;
		text-align: center;
	}
	.footer-inner{
		width: 100%;
		margin: 0 auto;
	}
	.footer-banner-wrap{
	}
	.fotter-sns-block{
		width: 80%;
		margin: 0 auto 1em;
	}
	.fotter-link-block{
		width: 80%;
		margin: 0 auto;
	}
	.footer-ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.footer-banner{
		border: 1px solid #231815;
	}
	.footer-banner-sns{
		width: 100%;
		margin: 1% 1% 10%;
	}
	.footer-banner-link{
		width: 47%;
		margin: 1%;
	}
	.footer-logo{
		width: 70%;
		margin: 1.5em auto 1em;
	}
	.copyright{
		width: 90%;
		margin: 0 auto;
		font-size: 0.6em;
		font-weight: bold;
		line-height: 1.8em;
	}
	
}



/*	AD BANNER
============================== */

.footer-ad-banner{
}

@media all and (min-width: 768px) {
	.footer-ad-banner{
		width: 375px;
		height: 111px;
		margin: 0 auto 2em;
		border: 2px solid #231815;
	}
	.footer-ad-include{
		
	}
}

@media all and (max-width: 767px) {
	.footer-ad-banner{
		width: 320px;
		height: 95px;
		margin: 0 auto 2em;
		border: 1px solid #231815;
	}
	.footer-ad-include{

	}
}



/*	OTHER CSS
============================== */


/*SP保存禁止*/
img{
	touch-callout:none;
	user-select:none;
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-moz-touch-callout:none;
	-moz-user-select:none;
}