@charset "utf-8";
/*
================================================================================================================
 コンテンツエリア
================================================================================================================
*/
.container {
	width:100%;
	min-height: calc(100% - 80px);
	min-height:-moz-calc(100% - 80px);
	min-height:-webkit-calc(100% - 80px);
	bottom:0;
	margin:auto;
	padding:0;		
overflow:hidden;
/*background-image: url(../img/common/bg_main.png);	*/
}
.content {
	position:relative;
	min-height: calc(100% - 80px);
	min-height:-moz-calc(100% - 80px);
	min-height:-webkit-calc(100% - 80px);
	top:0;
	bottom:0;
	padding:0 0 0 0;
}
.content:after{
    content: "";
  clear: both;
    display: block;
}
.inner{
	width:100%;
	max-width:1000px;
	margin:0 auto;
}
.inner.content{
	max-width:760px;
	border-radius: 6px;
	background-color: rgba(255,255,255,1.0);
}
.inner.list{
	max-width:1000px;
	background-color: rgba(255,255,255,0);
}
@media screen and (max-width:799px){
.container {
	min-height:calc(100% - 140px);
	min-height:-moz-calc(100% - 140px);
	min-height:-webkit-calc(100% - 140px);
}
.inner{
	max-width:inherit;
}

.inner.content,
.inner.list{
	width:96%;
}
	
}

/*
================================================================================================================
 タイトル・メインビジュアル
================================================================================================================
*/

.content_head{
position: relative;
overflow: hidden;
border-top:#054B9B 2px solid;	
}

.content_head .inner{
	overflow: hidden;
	position: relative;
}
.content_head:after{
    content: "";
  clear: both;
    display: block;
}
/*まじおつ。タイトルロゴ*/
.content_head #title_logo{
	position:relative;
	z-index: 2;
	clear: both;
	float:left;
	width:60%;
	margin-left: 4%;
	background-image: url('../img/common/title_logo.png');
	background-repeat: no-repeat;
	background-position:left 10px center;
	background-size:90%;
}
/*最新機種ロゴ*/
.content_head #new_series_logo{
	width:13%;
	float: left;
	background-repeat: no-repeat;
	background-position:left top;
	background-size:contain;
}

.content_head #new_series_logo:after{
    content: "";
  clear: both;
    display: block;
}

/*メインビジュアル　キャラ画像*/
.content_head #title_chara{
    position: absolute;
    width: 68%;
    top: -4%;
    right: -6%;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 80%;
}

.content_head #title_logo img,
.content_head #new_series_logo img,
.content_head #title_chara img,
.content_head #series_logobox img
/*
.content_head ul#series_logobox li img
*/{
	width:100%;
	height:auto;
	vertical-align: bottom;
}

.content_head #sub_title{
	background-color: rgba(240,95,12,1.00);
	padding: 5px;
	text-align: center;
	color:#FFF;
	font-weight:bold;
	font-size: 115%;
}

@media screen and (max-width:799px){
.content_head .inner{
	height:inherit;
	max-height:inherit;
}

.content_head #title_logo{
	position:absolute;
	width:74%;
	margin: 0;
	top:0;
	bottom:0;
	background-position:left center;
	background-size: 90%;
}
.content_head #title_chara{
	position: static;
	float:right;
	width: 55%;
    margin: 0 0% -5% 0;
	background-position:right 76% top -10px;
	background-size:auto 100%;
}
.content_head #sub_title{
	font-size: 87.5%;
}
}

@media screen and (max-width:480px){
.content_head #title_chara{}
}
/*
================================================================================================================
 コンテンツ
================================================================================================================
*/
/*PJAX設定エリア*/
#barba-wrapper{}
#barba-wrapper .barba-container{padding: 20px 0;}

/*PREV・NEXTボタン*/
#PREV,#NEXT{
	position:fixed;
	top:calc(50% - 22px);
	top:-moz-calc(50% - 22px);
	top:-webkit-calc(50% - 22px);
	font-size:16px;
	z-index:998;
}
#PREV{
	left:calc(((100% - 760px) / 2) - 80px);
	left:-moz-calc(((100% - 760px) / 2) - 80px);
	left:-webkit-calc(((100% - 760px) / 2) - 80px);
}
#NEXT{
	right:calc(((100% - 760px) / 2) - 80px);
	right:-moz-calc(((100% - 760px) / 2) - 80px);
	right:-webkit-calc(((100% - 760px) / 2) - 80px);
}
#PREV span,#NEXT span{
	font-size:18px;
}
#PREV a,#NEXT a{
	background-color:rgba(224,67,162,0.75);
	text-decoration:none;
	color:#fff;
	width: 64px;
	height:64px;
	border-radius:34px;
	-webkit-border-radius:34px;
	-moz-border-radius:34px;
	display:flex;
	flex-direction:row;
	justify-content:center;
	align-items:center;
	
}
#PREV a:hover,#NEXT a:hover {
	text-decoration:none;
	background-color:rgba(224,67,162,1.00);
}

@media screen and (max-width:799px) {
#PREV,#NEXT{
	top:calc(45% - 18px);
	top:-moz-calc(45% - 18px);
	top:-webkit-calc(45% - 18px);
	font-size: 14px;
}
#PREV{
	left:0;
}
#NEXT{
	right:0;
}	
#PREV span,#NEXT span{
	font-size:14px;
}
#PREV a,#NEXT a{
	width: 40px;
	height:40px;
}	
}

/*掲載日・検索結果データ*/
#date_area{
	width: 90%;
	max-width: 300px;
	margin: 0 auto;
	padding:20px 0; 
	text-align: center;
	color:#4376ad;
	font-weight: bold;
	font-size: 120%;
}
.inner.list #date_area{
	margin: 0 auto 30px;
	padding:20px;
	background-color:#fff;
}

/*第○回*/
#date_area .count{
border-bottom: 1px solid #4376ad;
padding-bottom:5px ;
}
/*公開日*/
#date_area .date{
padding:5px;
}
/*基本テキスト*/
.content .text{
width: 94%;
max-width: 980px;
font-size: 92.25%;
line-height: 160%;
padding-bottom:20px;
margin:0 auto 40px;
word-wrap: break-word;
}

/*基本テキスト　文字拡大*/
.content .text .big_text2{
font-size: 135.25%;
font-weight: bold;
}

/*基本テキスト　文字拡大*/
.content .text .big_text{
font-size: 125.25%;
font-weight: bold;
}

/*基本テキスト　カラー変更*/
.content .text .big_color_text{
font-weight: bold;
color:rgba(255,140,140,1.0);
}

/*基本テキスト　文字拡大*/
.content .text .big_text .attention_big{
  font-family: 'Rounded Mplus 1c';
  font-style: normal;
  font-weight: 900;
  line-height: 140%;
font-size: 135.25%;
}

.content .text hr{ border-top: 1px solid #05427B;
	margin: 25px 0;
}

/*マジハロＱ＆Ａタイトル*/
#FAQ_ttl{
	text-align: center;
	color:#FFF;
	font-weight: bold;
	font-size:115%;
	background-color:rgba(5,75,155,1.00);
	margin-bottom: 30px;
	padding: 7px;
	border-radius: 6px;
}

/*質問枠*/
.content .text .Que{
	position: relative;
  	margin-bottom: 20px;
	padding:0.3em 45px 10px;
	font-size:81.25%;
	background-color:rgba(242,133,204,0.2);
	font-size: 105%;
	color:#05427B;
	border-radius: 6px;
	word-wrap: break-word;
}
.content .text .Que::after{
  display: block;
  content: '【Q】';
  position: absolute;
  top: 0.3em;
  left: -0.1em;
  font-weight:bold;
font-size: 125%;
}
.content .text .Que span{
  font-weight:bold;
}
.content .text .Que p{
  margin: 0; padding: 0;
}

/*回答枠*/
.content .text .Ans {
    position: relative;
    margin-bottom: 40px;
    padding: 45px 45px 10px 0;
    font-size: 81.25%;
    font-size: 105%;
}
/*過去に来ていた質問を取り上げた*/
.content .text .Ans .request{
  border-radius:6px;
  background-color:#ffd6e4;
  padding:10px;
margin-bottom:10px;
}
.content .text .Ans::after{
  display: block;
  content: '【A】';
  position: absolute;
  top: 0.3em;
  left: -0.1em;
  font-weight:bold;
  font-size: 125%;
  color:#ff6907;
}
.content .text a.text,
.content .text .Que a,
.content .text .Ans a{
	text-decoration: underline;
	font-weight: bold;
	color: hsla(352,86%,57%,1.00);
}

/*テキスト内表*/
.content .text .Que dl,
.content .text .Ans dl{
	width: 100%;
	max-width: 400px;
	margin: 15px auto;
	border: 1px solid #05427B;
}
.content .text .Que dl:after,
.content .text .Ans dl:after{
    content: "";
  clear: both;
    display: block;
}
.content .text .Que dl dt,
.content .text .Que dl dd,
.content .text .Ans dl dt,
.content .text .Ans dl dd{
	float: left;
	padding: 3px 3px 3px 5px;
	border-bottom:1px solid #05427B;
}
.content .text .Que dl dt.last,
.content .text .Que dl dd.last,
.content .text .Ans dl dt.last,
.content .text .Ans dl dd.last{
	border-bottom:none;
}
.content .text .Que dl dt,
.content .text .Ans dl dt{
	width: 50%;
	border-right:1px solid #05427B;
	background-color:rgba(235,245,255,1.0);
	color: #05427B;
}
.content .text .Que dl dd,
.content .text .Ans dl dd{
	margin-left: 0;
	width:calc(50% - 17px);
	width:-moz-calc(50% - 17px);
	width:-webkit-calc(50% - 17px);
	background-color: #fff;
}

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

.content .text .Que{
	padding:0.3em 15px 10px 40px;
}	
.content .text .Ans {
    padding: 0.3em 15px 10px 0;
}
.content .text .Que dl dt,
.content .text .Que dl dd,
.content .text .Ans dl dt,
.content .text .Ans dl dd{
	clear: both;
	float: none;
	width: 100%;
	padding: 0;
	text-align: left;
	border-right:none;
}
.content .text .Que dl dt,
.content .text .Ans dl dt{
	border:none;
}
}

/*一覧リスト*/
.content ul#list{
	width: 100%;	
}
.content ul#list li{
	background-color: #fff;
	width:calc((99.9% - 30px) / 3);
	float: left;
	margin-right: 10px;
	margin-bottom: 30px;
	border-radius: 6px;
	position: relative;
}
.content ul#list li a:after{
    content: "";
  clear: both;
    display: block;
}

.content ul#list li .photo{
	float: none;
	width: 98%;
	margin: 0 auto 10px;
}
.content ul#list li .info{
	float: none;
	width:calc(100% - 20px);
	width:-moz-calc(100% - 20px);
	width:-webkit-calc(100% - 20px);
	padding: 5px 10px;
}
.content ul#list li .title{
	color:#999;
	font-size: 100%;
	font-weight: 600;
	min-height: 50px;
}
.content ul#list li .update{
	color:#05427B;
	font-size: 87.25%;
	width: 100%;
	text-align: right;
	position: static;
}
.content ul#list li img{
	width: 100%;
	height: auto;
}

/*質問フォーム*/
.content .form_btn{
	width:96%;
	max-width: 600px;
	border-radius: 10px;
	margin: 10px auto;
	background-image:url('../img/common/btn_form.jpg');
	background-repeat: no-repeat;
	background-position:center;
	background-size:contain;
	cursor: pointer;
}
/*Trick or Tweetリンクボタン*/
.content .form_btn.trick{
	background-image:url('../img/common/btn_form_TorT.jpg');
}
/*Trick or Tweetリンクボタン*/
.content .form_btn.mh6_official{
	background-image:url('../img/common/btn_mh6_offcial.jpg');
}

/*続・まじおつ。アーカイブリンクボタン*/
.content .form_btn.archive{
	background-image:url('../img/common/archive_link.png');
}

/*汎用バナーボタン*/
.content .form_btn.generic{
	background-image:none;
}
.content .form_btn.generic img{
	width: 100%; height: auto;
}
/*汎用バナーボタン リンクなし*/
.content .form_btn.no-touch{
	cursor:default;
}
/*汎用バナーボタン 上下隙間なし*/
.content .form_btn.no-space{
	margin: 0 auto;
}

.form_btn:after{
    content: "";
  clear: both;
    display: block;
}


/*汎用画像　上下隙間なし*/
.content .photo:after{content: "";display:block;clear:both;}
.content .photo_image{
	margin: 0 auto;
}

/*汎用画像　二枚横並び*/
.content .photo ul.double{widh:100%; }
.content .photo ul.double li{width:48%; float: left; list-style: none;}
.content .photo ul.double li:first-child{margin-right: 2%;}

.content .photo img,
.content .photo_image img,
.content .photo ul.double li img{
	width: 100%; height: auto;
}

@media screen and (max-width:799px){
#date_area{
	width: 98%;
	margin: 10px auto 20px;
	font-size: 100%;
}

.inner.list #date_area{
	width: 98%;
	margin: 10px auto 20px;
	padding:20px 0;
}
.content .text{
width: 96%;
font-size: 87.25%;
padding-bottom:5%;
margin:15px auto;
}

.content ul#list li{
	background-color: #fff;
	width:100%;
	clear: both;
	margin:0 0 3% 0;
	border:none;
}
.content ul#list li .photo{
	float: left;
	width: 50%;
	margin:0;
}
		
.content ul#list li .info{
	float: left;
	width:calc(50% - 20px);
	width:-moz-calc(50% - 20px);
	width:-webkit-calc(50% - 20px);
}
.content ul#list li .title{
	font-size: 92.25%;
}
.content ul#list li .update{
	position:absolute;
	bottom: 5px;
	right: 5px;
	width: 50%;
}
.content .form_btn{
	width:100%;
	margin:0 auto;
}
.content .form_btn.mh6_official,
.content .form_btn.trick{
	margin: 0 auto;
}	
	
}

@media screen and (max-width:600px){
/*汎用画像　二枚横並び*/
.content .photo ul.double li{width:100%;}
.content .photo ul.double li:first-child{margin:none;}
}

@media screen and (max-width:400px){
.content ul#list li .title{
	font-size: 87.25%;
}
}


/*楽曲解説用枠*/
.content .text .music{
	position: relative;
  	margin-bottom: 40px;
	padding:0.3em 45px 10px;
	font-size:81.25%;
	font-size: 105%;
	color:#9b6e07;
}
.content .text .music span{
	color:#ff6907;
	font-weight:bold;
}
.content .text .music p{
  margin: 0; padding: 0;
}

/*埋め込み動画*/
.movie{width:96%;max-width: 620px; margin: 20px auto;}
.movie .mov {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
}
.movie .mov iframe {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    width: 98%;
    height: 98%;
    margin: 0;
    overflow: hidden;
    border: 1px solid #000;
    background-color: #252e34;
}

/*モーダルウィンドウ用画像CSS*/
img.mfp-img {
    width: 96%;
	max-width:760px;
    height:auto;
    margin: 0 auto;
}
.mfp-image-holder .mfp-close {
    width: 50px;
    height: 50px;
    border-radius: 25px;
    background-color: #885802;
    top: 2%;
    right: -60px;
    -moz-transition: .6s;
    -webkit-transition: .6s;
    -o-transition: .6s;
    -ms-transition: .6s;
    transition: .6s;
}