@charset "utf-8";
/* Clearfix
--------------------------------------*/
.clearfix:after {
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
}

#wrapper img {
	vertical-align:bottom;
	width:100%;
}


body {
	-webkit-text-size-adjust: none;
}

.txt16{ font-size:120%; }
.txt22{ font-size:140%; }

/*
===== common style ====================================
*/

#wrapper{
	background:url(../img/bg_body01.png) repeat;
	color:#FFF;
	line-height:1.5;
}

#bg_cover{
	background:url(../img/bg_body02.png) repeat-y top center fixed;
	background-size:100%;
}

.section{
	margin:20px auto 40px;
	width:100%;
}

.section h2{
	margin:10px auto 0px;
	width:80%;
}

.box-style01{
	background:#000;
	border:1px solid #044814;
	box-sizing:border-box;
	margin-top:16%;
}

.box-style01 h2{
	margin-top:-12%;
}

@media screen and (min-width: 321px) {
	.br_max320{
		display:none;
	}
}

@media screen and (min-width: 415px) {
	.br_max414{
		display:none;
	}
}

@media screen and (min-width: 768px) {
	.section h2{
		width:50%;
	}
	.box-style01{
		margin-top:10%;
	}
	.box-style01 h2{
		margin-top:-8%;
	}
}

/*
===== header ====================================
*/
#qualidea-header{
	text-align:center;
}
#qualidea-header h1{
	margin:0 auto;
	padding:10px 0px;
	width:50%;
}
#qualidea-header #onair{
	width:70%;
	margin:10px auto 10px;
}
#qualidea-header #gl-menu{
	background:#000;
	border-top:1px solid #044814;
	border-bottom:1px solid #044814;
	display:table;
	padding:2%;
	box-sizing:border-box;
	width:100%;
}
#qualidea-header #gl-menu li{
	display:table-cell;
	width:50%;
}
#qualidea-header #onair-area.end{
	width:90%;
	padding:20px 10px;
	margin:10px auto;
	background:#000;
	border: 1px solid #06a431;
	box-sizing:border-box;
}

#qualidea-header #onair-area p{
	width:70%;
	margin:0px auto 5px;
}
#qualidea-header #onair-area.end p{
	width:100%;
	margin:0;
	font-size:120%;
}

#qualidea-header #onair-area dl{
	background:#000;
	border:1px solid #06a431;
	width:94%;
	margin:0px auto 10px;
	box-sizing:border-box;
	padding:5px;
}
#qualidea-header #onair-area dl dt{background:url(../img/bg_onair-dt.png) repeat;}
#qualidea-header #onair-area dl dd{color:#fee300;}


@media screen and (min-width: 768px) {
	#qualidea-header h1{width:30%;}
	#qualidea-header #onair{
		width:50%;
		margin:10px auto 10px;
	}
	#qualidea-header #gl-menu{
		padding:2% 20%;
	}
}

/*
===== introduction ====================================
*/
#introduction{
	background:url(../img/bg_intro.png) repeat;
	border-top:1px solid #044814;
	border-bottom:1px solid #044814;
	padding:0px 10px;
	margin-bottom:20px;
}
#introduction h2{
	margin:10px auto;
}
#introduction p{
	margin-bottom:20px;
}
#introduction .txt-lead{
	font-size:120%;
	font-weight:bold;
	text-align:center;
	color:#17b930;
}

@media screen and (min-width: 768px) {
	#introduction h2{
		width:50%;
	}
}

/*
===== movie ====================================
*/
#movie{margin-bottom:14%;}
#movie .box-movie{
	margin:10px 6% 15px;
}
#movie .box-movie h3{
	padding:5px;
	color:#000;
}
#movie .tokyo-side h3{background:#ff4b78;}
#movie .kanagawa-side h3{background:#27e6ff;}
#movie .chiba-side h3{background:#ebff00;}

.video-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}
 
.video-container iframe,  
.video-container object,  
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media screen and (min-width: 768px) {
	#movie{margin-bottom:10%;}
	#movie .box-movie{
		margin:5px 1% 20px;
		width:30%;
		display:inline-block;
	}
}

/*
===== staff ====================================
*/
#staff dl{
	margin:10px;
	text-align:left;
	display:table;
}
#staff dt ,#staff dd{
	display:table-cell;
}

@media screen and (min-width: 768px) {
	#staff{
		width:96%;
		margin-left:2%;
		margin-right:2%;
	}
}


/*
===== song ====================================
*/
#song dl{
	margin:0px 10px 10px;
	padding:10px 0px 0px 50px;
}
#song dl dt{
	margin-bottom:5px;
}
#song dl dd{
	color:#c8dd00;
	font-size:130%;
}
#song dl.op{
	background:url(../img/bg_op.png) no-repeat left 10px;
	background-size:40px;
}
#song dl.ed{
	background:url(../img/bg_ed.png) no-repeat left 10px;
	background-size:40px;
	border-top:1px solid #044814;
}

@media screen and (min-width: 768px) {
	#song{
		width:96%;
		margin-left:2%;
		margin-right:2%;
	}
}

/*
===== character ====================================
*/
#character{
	margin:10px auto;
}
#character h2{text-align:center;}
#character #chara-navi{
	display:table;
	margin:10px auto;
	width:260px;
}
#character #chara-navi ul{
	padding:4% 10px 2%;
	display:table-cell;
}
#character #chara-navi ul li{
	list-style:none;
	margin-bottom:10px;
	
}
#character #chara-navi ul li a{ display:block;}
#character #chara-navi ul li img{
	width:80px;
}
#character .box-chara{
	background:#000;
	padding:10px;
	margin:0% 1%;
	box-sizing:border-box;
	position:relative;
}
#character .box-chara h3{
	position:absolute;
	top:0;
	left:0;
	width:44px;
}
#character .box-chara .image{	margin:10px 10px 10px 40px;}
#character .box-chara dt{	padding-bottom:10px; }
#character .box-chara dd{ margin-top:10px;}

#character .tokyo-chara img ,#character .tokyo-side{border:1px solid #ff4b78;}
#character .tokyo-side dt{ border-bottom:1px solid #ff4b78; }
#character .tokyo-side strong{ color:#ff4b78; }

#character .kanagawa-chara img ,#character .kanagawa-side{border:1px solid #27e6ff;}
#character .kanagawa-side dt{ border-bottom:1px solid #27e6ff; }
#character .kanagawa-side strong{ color:#27e6ff; }

#character .chiba-chara img ,#character .chiba-side{border:1px solid #ebff00;}
#character .chiba-side dt{ border-bottom:1px solid #ebff00; }
#character .chiba-side strong{ color:#ebff00; }


#character .bx-wrapper{
	position:relative;
	margin:0px auto;
	width:90% !important;
}
#character .bx-controls .bx-prev{
	background:url(../img/chara/btn_prev.png) no-repeat;
	background-size:100%;
	position:absolute;
	top:40%;
	left:0;
	width:30px;
	height:76px;
	display:block;
	text-indent:-99999em;
}
#character .bx-controls .bx-next{
	background:url(../img/chara/btn_next.png) no-repeat;
	background-size:100%;
	position:absolute;
	top:40%;
	right:0;
	width:30px;
	height:76px;
	display:block;
	text-indent:-99999em;
}
#character .bx-controls .disabled{display:none;}


@media screen and (min-width: 768px) {
	#character #chara-navi{
		display:block;
		table-layout:none;
		margin:10px auto;
		width:92%;
		text-align:center;
	}
	#character #chara-navi ul{
		display:inline-block;
		padding:0;
		width:32%;
	}
	#character #chara-navi ul li{
		padding:2%;
		list-style:none;
		width:50%;
		box-sizing:border-box;
		display:block;
		float:left;
	}
	#character .box-chara{
		margin:0% 12%;
		}
	#character .bx-controls .bx-prev{
		left:5%;
	}
	#character .bx-controls .bx-next{
		right:5%;
	}
}


/*
===== footer ====================================
*/
#footer{
	margin-top:20px;
	padding-bottom:5px;
}

#footer .outlink a{
	background:#0ab136 url(../img/ico_allow.png) no-repeat 98% center;
	display:block;
	margin:0px 0px 10px;
	padding:10px 30px 10px 10px;
	text-decoration:none;	color:#000;
}
#footer .outlink a:hover{background:#e7ff00 url(../img/ico_allow.png) no-repeat 98% center;}
#footer .copyright{text-align:center; margin:0px 10px 10px;}
