/* =====================================
	PAGE css
====================================== */

/*	UNDER Layout
============================== */

.under-section{
	width: 100%;
	position: relative;
}
.under-content{
	position: relative;
}
#h2-news{
	background: url("../img/h2_news@2x.png");
	background-size: cover;
}
#h2-onair{
	background: url("../img/h2_onair@2x.png");
	background-size: cover;
}
#h2-staffcast{
	background: url("../img/h2_staffcast@2x.png");
	background-size: cover;
}
#h2-story{
	background: url("../img/h2_story@2x.png");
	background-size: cover;
}
#h2-character{
	background: url("../img/h2_character@2x.png");
	background-size: cover;
}
#h2-goods{
	background: url("../img/h2_goods@2x.png");
	background-size: cover;
}
#h2-special{
	background: url("../img/h2_special@2x.png");
	background-size: cover;
}
#h2-music{
	background: url("../img/h2_music@2x.png");
	background-size: cover;
}
#h2-disc{
	background: url("../img/h2_disc@2x.png");
	background-size: cover;
}


@media all and (min-width: 768px) {
	#under-header-area{
		width: 100%;
		background: #ffffff;
		box-shadow: 0px 5px 3px rgba(0,0,0,0.2);
	}
	#under-header{
		width: 950px;
		height: 110px;
		margin: 0 auto;
		padding: 30px 0 30px;
	}
	.under-gnav-sp{
		display: none;
	}
	.under-h2{
		width: 403px;
		height: 175px;
		margin: 0 auto;
	}
	.under-content{
		background: 
			url("../img/content_bg_left.png"),
			url("../img/content_bg_right.png"),
			rgba(255,255,255,0);
		background-position: 
			left 5% bottom -200px,
			right 5% bottom -200px,
			0;
		background-repeat: no-repeat;
		padding: 0 0 300px;
	}
}

@media all and (max-width: 767px) {
	#under-header-area{
		width: 100%;
		background: #ffffff;
		box-shadow: 0px 5px 3px rgba(0,0,0,0.2);
		padding: 10px 0;
		border-top: 1px solid #ddd;
		position: -webkit-sticky;
		position: sticky;
		top: 0;
		z-index: 999;
	}
	#under-header{

	}
	.under-gnav-sp{
		
	}
	.under-h2{
		width: 250px;
		height: 109px;
		margin: 0 auto;
	}
	.under-content{
		background: 
			url("../img/content_bg_left.png"),
			url("../img/content_bg_right.png"),
			rgba(255,255,255,0);
		background-position: 
			left -3% bottom -170px,
			right -8% bottom -150px,
			0;
		background-size: 
			20%,
			30%,
			0;
		background-repeat: no-repeat;
		padding: 0 0 200px;
	}
	
	/*========= ナビゲーションのためのCSS ===============*/

	/*アクティブになったエリア*/
	#g-nav-sp.panelactive{
		/*position:fixed;にし、z-indexの数値を大きくして前面へ*/
		position:fixed;
		z-index: 999;
		top: 0;
		width:100%;
		height: 100vh;
	}

	/*丸の拡大*/
	.circle-bg{
		position: fixed;
		z-index:3;
		/*丸の形*/
		width: 100px;
		height: 100px;
		border-radius: 50%;
		background: #ff8ea4;
		/*丸のスタート位置と形状*/
		transform: scale(0);/*scaleをはじめは0に*/
		right:-50px;
		top:-50px;
		transition: all .6s;/*0.6秒かけてアニメーション*/
	}

	.circle-bg.circleactive{
		transform: scale(50);/*クラスが付与されたらscaleを拡大*/
	}

	/*ナビゲーションの縦スクロール*/
	#g-nav-list{
		display: none;/*はじめは表示なし*/
		/*ナビの数が増えた場合縦スクロール*/
		position: fixed;
		z-index: 9999; 
		width: 100%;
		height: 100vh;
		overflow: auto;
		-webkit-overflow-scrolling: touch;
	}

	#g-nav-sp.panelactive #g-nav-list{
		 display: block; /*クラスが付与されたら出現*/
	}

	/*ナビゲーション*/
	#g-nav-sp ul {
		opacity: 0;/*はじめは透過0*/
		/*ナビゲーション天地中央揃え※レイアウトによって調整してください。不必要なら削除*/
		position: absolute;
		z-index: 999;
		top:50%;
		left:50%;
		transform: translate(-50%,-50%);
	}

	/*背景が出現後にナビゲーションを表示*/
	#g-nav-sp.panelactive ul {
		opacity:1;
	}

	/* 背景が出現後にナビゲーション li を表示※レイアウトによって調整してください。不必要なら削除*/
	#g-nav-sp.panelactive ul li{
		animation-name:gnaviAnime;
		animation-duration:1s;
		animation-delay:.2s;/*0.2 秒遅らせて出現*/
		animation-fill-mode:forwards;
		opacity:0;
	}
	@keyframes gnaviAnime{
		0% {
			opacity: 0;
		}
		100% {
			opacity: 1;
		}
	}


	/*リストのレイアウト設定*/
	#g-nav-sp li{
		text-align: center; 
		list-style: none;
	}

	#g-nav-sp li a{
		/*
		color: #333;
		text-decoration: none;
		padding:10px;
		display: block;
		text-transform: uppercase;
		letter-spacing: 0.1em;
		font-weight: bold;
		*/
		width: 300px;
		margin: 0 auto 20px;
		display: block;
	}
	#g-nav-sp li a img{
		width: 100%;
	}


/*========= ボタンのためのCSS ===============*/
	.openbtn1{
		position:absolute;
		top:16px;
		right: 0px;
		z-index: 9999;/*ボタンを最前面に*/
		cursor: pointer;
		width: 60px;
		height:60px;
	}
	/*×に変化*/  
	.openbtn1 span{
		display: inline-block;
		transition: all .4s;
		position: absolute;
		left: 14px;
		height: 3px;
		border-radius: 2px;
		background-color: #ff8ea4;
		width: 45%;
	  }
	.openbtn1 span:nth-of-type(1) {
		top:15px; 
	}
	.openbtn1 span:nth-of-type(2) {
		top:23px;
	}
	.openbtn1 span:nth-of-type(3) {
		top:31px;
	}
	.openbtn1.active span:nth-of-type(1) {
		top: 18px;
		left: 18px;
		transform: translateY(6px) rotate(-45deg);
		width: 30%;
		background-color: #fff;
	}
	.openbtn1.active span:nth-of-type(2) {
		opacity: 0;
		background-color: #fff;
	}
	.openbtn1.active span:nth-of-type(3){
		top: 30px;
		left: 18px;
		transform: translateY(-6px) rotate(45deg);
		width: 30%;
		background-color: #fff;
	}
}


/*	01.NEWS
============================== */
.newslist time,
.news-header time{
	color: #ff5778;
	font-weight: bold;
}
.news-title{
	font-weight: normal;
}
.newslist li,
#newscontent-area{
	background: #fff;
	border-radius: 20px;
	border: 1px solid #3c3d3e;
	/*
	box-shadow: 0 0 10px 0 rgba(0,0,0,.3);
	*/
}
.news-h4{
	color: #5091e5;
	line-height: 1.4em;
}
.news-h5{
	color: #ff5778;
	line-height: 1.4em;
}
.news_back01{
	background: url("../img/news_backbtn_01.png") no-repeat;
	background-size: contain;
}
.news_back02{
	background: url("../img/news_backbtn_02.png") no-repeat;
	background-size: contain;
}
.news-img img{
	width: 100%;
}
.news-text small{
	font-size: 70%
}


@media all and (min-width: 768px) {
	#newslist-area,
	.newscontent-area{
		width: 860px;
		margin: 50px auto;
	}
	.newslist{
		margin: 0 0 200px;
	}
	.newslist li{
		width: 800px;
		margin: 0 0 30px;
		padding: 30px 30px 20px;
	}
	.newslist time,
	.news-header time{
		font-size: 14px;
		line-height: 2em;
		margin: 0 0 6px;
	}
	.newslist p{
		font-size: 20px;
		line-height: 1.5em; 
		margin: 0 0 6px;
	}
	#newscontent-area{
		width: 740px;
		margin: 50px auto 100px;
		padding: 60px 60px 80px;
	}
	.news-title{
		font-size: 28px;
		line-height: 1.5em;
		margin: 6px 0 24px;
	}
	.news-img{
		width: 740px;
		margin: 2em auto 1em;
	}
	.news-h4{
		font-size: 20px;
		margin: 2em 0 0.5em;
	}
	.news-h5{
		font-size: 16px;
		margin: 2em 0 0.5em;
	}
	.news-text{
		font-size: 16px;
		line-height: 1.5em;
		margin: 0.5em 0 1em;
	}
	.news-text-small{
		font-size: 12px;
		line-height: 1.6em;
		margin: 0em 0 2em;
	}
	.news_back01{
		width: 201px;
		height: 33px;
		margin: 0 auto;	
	}
	.news_back02{
		width: 87px;
		height: 33px;
		margin: 0 auto;	
	}

}
@media all and (max-width: 767px) {
	#newslist-area{
		width: 100%;
		margin: 2em auto;
	}
	.newslist{
		margin: 0 0 50px;
	}
	.newslist li{
		width: 75%;
		margin: 0 auto 1.5em;
		padding: 3% 6%;
	}
	.newslist time,
	.news-header time{
		font-size: 0.7em;
		line-height: 2em;
		margin: 0;
	}
	.newslist p{
		font-size: 0.9em;
		line-height: 1.5em; 
		margin: 0 0 6px;
	}
	#newscontent-area{
		width: 80%;
		margin: 2em auto 50px;
		padding: 6% 6%;
	}
	.news-title{
		font-size: 1.1em;
		line-height: 1.5em;
		font-weight: bold;
		margin: 0.5em 0 1em;
	}
	.news-img{
		width: 100%;
		margin: 1em auto 1em;
	}
	.news-h4{
		font-size: 0.9em;
		margin: 2em 0 0.5em;
	}
	.news-h5{
		font-size: 0.9em;
		margin: 2em 0 0.5em;
	}
	.news-text{
		font-size: 0.9em;
		line-height: 1.6em;
		margin: 0 0 1em;
	}
	.news-text-small{
		font-size: 0.7em;
		line-height: 1.6em;
		margin: 0 0 2em;
	}
	.news_back01{
		width: 40%;
		margin: 0 auto;
		padding-top: 3%;
	}
	.news_back02{
		width: 20%;
		margin: 0 auto;
		padding-top: 3%;
	}
}


/*	02.ONAIR
============================== */
.h3-onair{
background: 
	url("../onair/img/h3_onair@2x.png") no-repeat;
}
.h3-stream{
background: 
	url("../onair/img/h3_stream@2x.png") no-repeat
}
.onair-text{
	background: url("../onair/img/onair_pc_3@2x.png");
	background-repeat: no-repeat;
	background-size: contain;
}
.stream-text{
	background: url("../onair/img/stream_pc_2@2x.png");
	background-repeat: no-repeat;
	background-size: contain;
}
.niconico-url{
	text-align: center;
}
.haishin-table{
	line-height: 1.4em;
	border-collapse: separate;
	border-spacing: 0;
}
.haishin-table-td01{
	font-weight: bold;
}
.haishin-table-td02{
	font-weight: normal;
}
.haishin-table th{
	color: #ffffff;
	background: #5091e5;
}
.haishin-table-td01,
.haishin-caution{
	color: #5091e5;
}
.haishin-table td{
	border-bottom: 1px solid #5091e5;
}

@media all and (min-width: 768px) {
	#onair-area,
	#stream-area{
		width: 950px;
		margin: 85px auto 100px;
	}
	.h3-onair,
	.h3-stream{
		width: 250px;
		height: 40px;
		background-size:contain;
		background-position: center;
		margin: 0 auto 45px;
	}
	.onair-text{
		width: 621px;
		height: 929px;
		margin: 0 auto;
	}
	.stream-text{
		width: 621px;
		height: 457px;
		margin: 0 auto 30px;
	}
	.niconico-url{
		font-size: 16px;
		font-weight: bold;
		line-height: 32px;
		margin: 0 auto 60px;
	}
	.haishin-table{
		width: 620px;
		text-align: left;
		margin: 20px auto;
	}
	.haishin-table th{
		padding: 0.5em 1em;
	}
	.haishin-table td{
		padding: 1em 0.5em;
	}
	.haishin-table-td01{
		width: 200px;
	}
	.haishin-caution{
		font-size: 20px;
		text-align: center;
		margin: 0 0 20px;
	}
	.haishin-table-td02{
		font-size: 0.8em;
	}
	.haishin-table-td01 span{
		font-size: 0.8em;
	}
}
@media all and (max-width: 767px) {
	#onair-area,
	#stream-area{
		width: 100%;
		margin: 2em auto;
	}
	.h3-onair,
	.h3-stream{
		width: 40%;
		background-size:contain;
		background-position: center;
		margin: 0 auto 2em;
		padding-top: 2%;
	}
	.onair-text{
		width: 75%;
		margin: 0 auto;
		padding-top: 110%;
	}
	.stream-text{
		width: 75%;
		margin: 0 auto 5%;
		padding-top: 52%;
	}
	.niconico-url{
		font-size: 0.9em;
		font-weight: bold;
		line-height: 1.5em;
		margin: 0 auto 10%;
	}
	.haishin-table{
		width: 75%;
		text-align: left;
		margin: 0 auto;
	}
	.haishin-table th{
		font-size: 0.9em;
		padding: 0.3em 0.5em 0.2em;
	}
	.haishin-table th span{
		font-size: 0.8em;
	}
	.haishin-table td{
		padding: 0.5em 0 0.5em 0.2em;
	}
	.haishin-table-td01{
		width: 40%;
		font-size: 0.9em;
		line-height: 1.4em;
	}
	.haishin-table-td01 span{
		font-size: 0.7em;
	}
	.haishin-table-td02{
		width: 58%;
		font-size: 0.7em;
		margin: 0 0 0 2%;
		line-height: 1.4em;
	}
}


/*	03.STAFF&CAST
============================== */

.top-staffcast-block{
}
.h3-staff{
background: 
	url("../staffcast/img/h3_staff@2x.png") no-repeat;
}
.h3-cast{
background: 
	url("../staffcast/img/h3_cast@2x.png") no-repeat
}
.staff-list-ul,
.cast-list-ul{
	display: flex;
	justify-content:flex-start;
	flex-wrap: wrap;
}
.staff-list-li{
	border-bottom: 1px solid #ff7caa;
	font-weight: bold;
	color: #ff7caa;
}
.cast-list-li{
	border-bottom: 1px solid #5091e5;
	font-weight: bold;
	color: #5091e5;
}
.list-max{
	width: 100%;
}


@media all and (min-width: 768px) {
	#staffcast-area{
		width: 1030px;
		margin: 70px auto 100px;
	}
	.top-staffcast-block-inner{
		width: 1000px;
		margin: 0 auto;
		justify-content: center;
	}
	.staff-block,
	.cast-block{
		width: 800px;
		margin: 40px auto 0;
	}
	.h3-staff,
	.h3-cast{
		width: 250px;
		height: 40px;
		background-size:contain;
		background-position: center;
		margin: 0 auto 45px;
	}
	.staff-list-li,
	.cast-list-li{
		width: 23%;
		margin: 0 1% 2em;
		padding: 0 0 1em 0;
	}
	.staff-block dt,
	.cast-block dt{
		font-size: 14px;
		margin: 0 0 0.8em 0;
	}
	.staff-block dd,
	.cast-block dd{
		font-size: 20px;
	}
	.staff-block dd span,
	.cast-block dd span{
		font-size: 12px;
	}
	.list-max{
		width: 100%;
	}


}
@media all and (max-width: 767px) {
	#staffcast-area{
		width: 100%;
		margin: 2em auto;
	}
	.staff-block,
	.cast-block{
		width: 80%;
		margin: 1em auto 0;
	}
	.h3-staff,
	.h3-cast{
		width: 60%;
		background-size:contain;
		background-position: center;
		margin: 0 auto 2em;
		padding-top: 4%;
	}
	.staff-list-ul,
	.cast-list-ul{
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.staff-list-li,
	.cast-list-li{
		width: 48%;
		margin: 0 0 2em 0;
		padding: 0 0 1em 0;
	}
	.staff-block dt,
	.cast-block dt{
		font-size: 0.8em;
		margin: 0 0 0.4em 0;
	}
	.staff-block dd,
	.cast-block dd{
		font-size: 1em;
	}
	.staff-block dd span,
	.cast-block dd span{
		font-size: 0.6em;
		line-height: 3em;
	}
	.list-max{
		width: 100%;
	}
	

}


/*	04.STORY
============================== */

.h3-introduction{
	background: url("../story/img/h3_introduction@2x.png");
	background-repeat: no-repeat;
}
.introduction-text{
	background-position: center center;
}
.introduction-bottom{
	background: url("../story/img/introduction_bottom@2x.png");
	background-repeat: no-repeat;
}
.story-nav li img,
.story-intro-btn img{
	width: 100%;
}
.flexslider, 
.flexslider img{
	width: 100%;
}
.story-header{
	text-align: center;
}
.story-staff{
	border-bottom: 1px solid #ddd;
}


@media all and (min-width: 768px) {
	/*STORY ALL*/
	#storyall-area{
		width: 1030px;
		margin: 70px auto 100px;
	}
	.story-nav{
		width: 1030px;
		margin: 0 auto;
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
	}
	.story-nav li{
		width: 310px;
		margin: 15px;
	}
	.story-intro-btn{
		width: 550px;
		margin: 60px auto;
	}
	
	/*STORY*/
	#story-area{
		width: 1030px;
		margin: 70px auto 100px;
	}
	.flexslider{
		width: 720px;
		margin: 0 auto;
		filter: drop-shadow(0px 10px 10px rgba(0,0,0,0.4));
		border-radius: 30px !important;
		overflow: hidden;
	}
	.story-header{
		width: 720px;
		margin: 0 auto;
	}
	.story-number{
		font-size: 20px;
		font-weight: bold;
		margin-bottom: 10px;
	}
	.story-title{
		font-size: 30px;
		margin-bottom: 16px;
	}
	.story-text{
		width: 710px;
		margin: 30px auto 20px;
		font-size: 16px;
		font-weight: bolder;
		line-height: 32px;
	}
	.story-staff{
		width: 710px;
		margin: 0 auto 20px;
		padding-bottom: 30px;
		font-size: 12px;
		font-weight: bold;
		line-height: 20px;
	}
	
	/*INTRO*/
	#introduction-area{
		width: 1030px;
		margin: 70px auto 100px;
	}
	.h3-introduction{
		width: 250px;
		height: 40px;
		background-size:contain;
		background-position: center;
		margin: 0 auto 24px;
	}
	.introduction-text{
		width: 880px;
		height: 350px;
		margin: 0 auto;
		background: url("../story/img/introduction_text_pc@2x.png");
		background-repeat: no-repeat;
		background-size: contain;
	}
	.introduction-bottom{
		width: 870px;
		height: 360px;
		margin: 40px auto 0;
		background-size: cover;
	}
	.btn_back_story{
		margin: 100px auto 0;
	}


}
@media all and (max-width: 767px) {
	/*STORY ALL*/
	#storyall-area{
		width: 100%;
		margin: 0 auto 10%;
	}
	.story-nav{
		width: 100%;
		margin: 10% auto 0;
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
	}
	.story-nav li{
		width: 70%;
		margin: 5% auto;
	}
	.story-intro-btn{
		width: 90%;
		margin: 5% auto 10%;
	}
	
	/*STORY*/
	#story-area{
		width: 90%;
		margin: 0 auto 10%;
	}
	.flexslider{
		width: 100%;
		filter: drop-shadow(0px 10px 10px rgba(0,0,0,0.4));
		border-radius: 10px !important;
		overflow: hidden;
	}
	.story-header{
		width: 100%;
		margin: 10% auto 0;
	}
	.story-number{
		font-size: 1em;
		font-weight: bold;
		margin-bottom: 1%;
	}
	.story-title{
		font-size: 1.4em;
		line-height: 1.3em;
		margin-bottom: 0.5em;
	}
	.story-text{
		width: 100%;
		margin: 2em auto 1em;
		font-size: 0.9em;
		font-weight: bolder;
		line-height: 1.4em;
	}
	.story-staff{
		width: 100%;
		margin: 0 auto 20px;
		padding-bottom: 30px;
		font-size: 0.7em;
		font-weight: bold;
		line-height: 1.5em;
	}
	
	/**/
	#introduction-area{
		width: 100%;
		margin: 2em auto;
	}
	.h3-introduction{
		width: 60%;
		background-size:contain;
		background-position: center;
		margin: 0 auto 2em;
		padding-top: 4%;
	}
	.introduction-text{
		width: 95%;
		margin: 0 auto;
		padding-top: 70%;
		background: url("../story/img/introduction_text_sp@2x.png");
		background-repeat: no-repeat;
		background-size: contain;
	}
	.introduction-bottom{
		width: 100%;
		margin: 1em auto 0;
		padding-top: 60%;
		background-size: contain;
	}

}


/*	05.CHARACTER
============================== */

.character-nav{
	display: flex;
}
.character-nav li img{
	width: 100%;
}
.character-container-01{
	background: url("../character/img/charaimg_01@2x.png");
	background-repeat: no-repeat;
}
.character-container-02{
	background: url("../character/img/charaimg_02@2x.png");
	background-repeat: no-repeat;
}
.character-container-03{
	background: url("../character/img/charaimg_03@2x.png");
	background-repeat: no-repeat;
}
.character-container-04{
	background: url("../character/img/charaimg_04@2x.png");
	background-repeat: no-repeat;
}
.character-container-05{
	background: url("../character/img/charaimg_05@2x.png");
	background-repeat: no-repeat;
}
.character-container-06{
	background: url("../character/img/charaimg_06@2x.png");
	background-repeat: no-repeat;
}
.character-container-07{
	background: url("../character/img/charaimg_07@2x.png");
	background-repeat: no-repeat;
}
.character-container-08{
	background: url("../character/img/charaimg_08@2x.png");
	background-repeat: no-repeat;
}
.character-container-09{
	background: url("../character/img/charaimg_09@2x.png");
	background-repeat: no-repeat;
}
.character-container-10{
	background: url("../character/img/charaimg_10@2x.png");
	background-repeat: no-repeat;
}
.character-container-11{
	background: url("../character/img/charaimg_11@2x.png");
	background-repeat: no-repeat;
}

@media all and (min-width: 768px) {
	
	#character-area{
		width: 870px;
		margin: 70px auto 70px;
	}
	.character-nav{
		width: 870px;
		margin: 0 auto 30px;
		justify-content: space-between;
	}
	.character-nav li{
		width: 70px;
		border: 1px solid #3c3d3e;
		border-radius: 10px;
	}
	#character-container{
		width: 870px;
		height: 700px;
		position: relative;
		background-size: cover;
	}
	#character-caption{
		width: 436px;
		height: 500px;
		position: absolute;
		top: 60px;
		right: 0;
		background-repeat: no-repeat;
		background-size: contain;
	}
	.character-caption-01{
		background: url("../character/img/profile_card_01@2x.png");
	}
	.character-caption-02{
		background: url("../character/img/profile_card_02@2x.png");
	}
	.character-caption-03{
		background: url("../character/img/profile_card_03@2x.png");
	}
	.character-caption-04{
		background: url("../character/img/profile_card_04@2x.png");
	}
	.character-caption-05{
		background: url("../character/img/profile_card_05@2x.png");
	}
	.character-caption-06{
		background: url("../character/img/profile_card_06@2x.png");
	}
	.character-caption-07{
		background: url("../character/img/profile_card_07@2x.png");
	}
	.character-caption-08{
		background: url("../character/img/profile_card_08@2x.png");
	}
	.character-caption-09{
		background: url("../character/img/profile_card_09@2x.png");
	}
	.character-caption-10{
		background: url("../character/img/profile_card_10@2x.png");
	}
	.character-caption-11{
		background: url("../character/img/profile_card_11@2x.png");
	}

}
@media all and (max-width: 767px) {
	#character-area{
		width: 100%;
		margin: 2em auto;
	}
	.character-nav{
		width: 90%;
		margin: 0 auto 1em;
		flex-wrap: wrap;
		justify-content: flex-start;
	}
	.character-nav li{
		width: 13%;
		margin: 1.5%;
		border: 1px solid #3c3d3e;
		border-radius: 5px;
	}
	#character-container{
		width: 100%;
		margin-top: -3%;
		padding-top: 120%;
		position: relative;
		background-size: 150%;
		background-position:right 180% top 35%;
	}
	#character-caption{
		width: 60%;
		padding-top: 65%;
		position: absolute;
		top: 15%;
		left: 4%;
		background-repeat: no-repeat;
		background-size: contain;
	}
	.character-caption-01{
		background: url("../character/img/profile_card_01_sp@2x.png");
	}
	.character-caption-02{
		background: url("../character/img/profile_card_02_sp@2x.png");
	}
	.character-caption-03{
		background: url("../character/img/profile_card_03_sp@2x.png");
	}
	.character-caption-04{
		background: url("../character/img/profile_card_04_sp@2x.png");
	}
	.character-caption-05{
		background: url("../character/img/profile_card_05_sp@2x.png");
	}
	.character-caption-06{
		background: url("../character/img/profile_card_06_sp@2x.png");
	}
	.character-caption-07{
		background: url("../character/img/profile_card_07_sp@2x.png");
	}
	.character-caption-08{
		background: url("../character/img/profile_card_08_sp@2x.png");
	}
	.character-caption-09{
		background: url("../character/img/profile_card_09_sp@2x.png");
	}
	.character-caption-10{
		background: url("../character/img/profile_card_10_sp@2x.png");
	}
	.character-caption-11{
		background: url("../character/img/profile_card_11_sp@2x.png");
	}
	.character-container-10{
		background-position:right 180% top 1200% !important;
	}
	

}


/*	06.GOODS
============================== */

/*ENTRY*/
.goodsentry-list li img{
	width: 100%;
}
.disc-content-block{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

/*DISC*/
.discnav li img{
	width: 100%;
}
.disc-title{
	text-align: center;
}
.disc-title img{
	width: 100%;
}
.disc01-caprion dt,
.disc-oritoku-type-01{
	color: #5091e5 !important;
}
.disc02-caprion dt,
.disc-oritoku-type-02{
	color: #ff5778 !important;
}
.disccc-caprion dt,
.disc-oritoku-type-cc{
	color: #581fcc !important;
}
.disc03-caprion dt{
	color: #f5d709 !important;
}
.disc04-caprion dt{
	color: #ff6548 !important;
}
.disc-oritoku-type-03{
	color: #581fcc !important;
}
.disc-oritoku-shop,
.disc-oritoku-type{
	font-weight: bold;
}
.disc-oritoku-wrap{
	display: flex;
	justify-content: flex-start;
	flex-wrap:wrap;
}
.dotline_disc,
.dotline_disc_02,
.dotline_disc_03,
.dotline_disc_04,
.dotline_disc_cc{
  height: 2px;
  position: relative;
}
.dotline_disc::before {
  content: "";
  background-image: linear-gradient(to right, #5091e5, #5091e5 3px, transparent 3px, transparent 8px);
  background-size: 8px 2px;
  background-repeat: repeat-x;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.dotline_disc_02::before {
  content: "";
  background-image: linear-gradient(to right, #ff5778, #ff5778 3px, transparent 3px, transparent 8px);
  background-size: 8px 2px;
  background-repeat: repeat-x;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.dotline_disc_03::before {
  content: "";
  background-image: linear-gradient(to right, #f2f124, #f2f124 3px, transparent 3px, transparent 8px);
  background-size: 8px 2px;
  background-repeat: repeat-x;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.dotline_disc_04::before {
  content: "";
  background-image: linear-gradient(to right, #ff6548, #ff6548 3px, transparent 3px, transparent 8px);
  background-size: 8px 2px;
  background-repeat: repeat-x;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.dotline_disc_cc::before {
  content: "";
  background-image: linear-gradient(to right, #581fcc, #581fcc 3px, transparent 3px, transparent 8px);
  background-size: 8px 2px;
  background-repeat: repeat-x;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.disc-tokuten-read{
	width: 100%;
	margin: 0 auto;
	text-align: center;
	font-weight: bold;
}
.disc-tokuten-img{
	width: 100%
}
.disc-tokuten-img img{
	width: 100%;
	box-shadow: 0 0 4px 0 rgba(0,0,0,.3);
}
.disc-tokuten-list{
	
}
.ccbd-tokuten-read{
	font-weight: bold;
	margin: 2em 0 0;
}
.disccc-caprion dd img{
	width: 50%;
	text-align: center;
}

/*GOODS*/
.goods-list-wrap{
	display: flex;
	flex-wrap: wrap;
}
.goodsall-img{
	border: 2px solid #ff5778;
}
.goods-img img,
.oritoku-img img,
.disc-oritoku-img img{
	width: 100%;
	box-shadow: 0 0 4px 0 rgba(0,0,0,.3);
}
.goodsall-img img,
.goods-img img{
	width: 100%;
}
.goodsall-text,
.goods-name{
	color: #ff5778;
	font-weight: bold;
	line-height: 1.4em;
}

/* newspage */
#goodscontent-area{
	background: #fff;
	border-radius: 20px;
	border: 1px solid #3c3d3e;
	display: flex;
	flex-wrap: wrap;
}
.cdcontent-area{
	background: #fff;
	border-radius: 20px;
	border: 1px solid #3c3d3e;
	display: flex;
	flex-wrap: wrap;
}
.goods-caption-list dt {
    font-weight: bold;
    color: #5091e5;
	margin: 0 0 0.5em 0;
}
.goods-caption-list dd {
    margin: 0 0 1em 0;
	line-height: 1.5em
}
.oritoku-wrap{
	display: flex;
	justify-content: flex-start;
	flex-wrap:wrap;
}
.oritoku-block{
	padding-bottom: 2em;
	border-bottom: 1px solid #e5e5e5;
}
.oritoku-img{
	margin-bottom: 1em;
}
.cd-name img,
.cd-oritoku img,
.oritoku-img img,
.oritoku-rendou img{
	width: 100%;
}
.oritoku-shop{
	color: #581fcc;
	font-weight: bold;
	margin-bottom: 1em;
}
.oritoku-item{
	font-weight: bold;
}
.oritoku-item span{
	font-size: 70%;
}
.oritoku-rendou{
	margin-bottom: 1em;
}
.btn-cd-rinji{
	border-radius: 25px;
	background: #ff5778;
	color: #ffffff;
	text-align: center;
	font-weight: bold;
	padding: 0.5em;

}
.btn-cd-rinji a{
	color: #ffffff;
	text-align: center;
	font-weight: bold;
}

@media all and (min-width: 768px) {
	
	/*ENTRY*/
	#goodsentry-area{
		width: 950px;
		margin: 50px auto;
	}
	.goodsentry-list{
		display: flex;
	}
	.goodsentry-list li{
		width: 386px;
	}
	
	/*DISC*/
	.discnav{
		width: 520px;
		margin: 40px auto 0;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.discnav li{
		width: 76px;
	}
	.disc-title{
		margin: -30px auto 40px;
	}
	.disc-title-01,
	.disc-title-02,
	.disc-title-03,
	.disc-title-04{
		width: 551px;
	}
	.disc-title-05{
		width: 510px;
	}
	.disc-title-cc{
		width: 725px;
	}
	.disc-oritoku-wrap{
		width: 720px;
		margin: 0 auto;
	}
	.disc-oritoku-block{
		width: 230px;
		margin: 0 5px 32px;
	}
	.disc-oritoku-img{
		width: 230px;
		margin: 0 0 10px;
	}
	.disc-oritoku-caption{
		width: 220px;
		margin: 12px auto 0;
	}
	.disc-oritoku-type{
		font-size: 12px;
		margin: 0 0 4px;
	}
	.disc-oritoku-shop{
		font-size: 18px;
		margin: 0 0 2px;
		line-height: 1.3em;
	}
	.disc-oritoku-shop span{
		font-size: 14px;
	}
	.disc-oritoku-item{
		font-size: 14px;
		line-height: 1.5em;
	}
	
	.disc-tokuten-block{
		margin: 20px auto 0;
	}
	.disc-tokuten-read{
		margin: 40px auto 32px;
	}
	.h4-tokuten{
		font-size: 40px;
		margin: 0.2em auto;
	}
	.disc-tokuten-list{
		width: 680px;
		font-size: 18px;
		line-height: 1.5em;
		margin: 16px auto 0;
	}
	.disc-tokuten-list li{
		margin: 0 0 1em 1em;
		list-style: disc !important;
	}
	
	
	
	/*GOODS*/
	
	#goodslist-area{
		width: 950px;
		margin: 50px auto;
	}
	.goods-list-wrap{
		width: 940px;
		margin: 0 auto;
		justify-content: flex-start;
	}
	.goodsall-list{
		width: 190px;
		margin: 0 22px 45px;
	}
	.goodsall-img{
		width: 190px;
	}
	.goodsall-text{
		font-size: 16px;
		margin: 14px 0 0;
	}
	
	/*goodspage*/
	
	#goodscontent-area{
		width: 740px;
		margin: 50px auto 100px;
		padding: 80px 60px 80px;
	}
	.cdcontent-area{
		width: 740px;
		margin: 50px auto 100px;
		padding: 80px 60px 80px;
	}
	.goods-img{
		width: 320px;
	}
	.goods-caption{
		width: 380px;
		margin: 0 0 0 32px;
	}
	.goods-name{
		font-size: 24px;
		margin: 0 0 24px 0;
	}
	.goods-caption-list dt {
		font-size: 14px;	
	}
	.goods-caption-list dd {
		font-size: 16px;
	}
	.cd-name{
		width: 420px;
		margin-bottom: 2em;
	}
	.cd-oritoku{
		width: 493px;
		height: 42px;
		margin: 0 auto 60px;
		text-align: center;
	}
	.oritoku-wrap{
		width: 750px;
		margin: 0 0 0 -35px;
	}
	.oritoku-block{
		width: 230px;
		margin: 0 10px 4em;
	}
	.oritoku-img{
		width: 230px;
	}
	.oritoku-shop{
		height: 2.4em;
		font-size: 14px;
		line-height: 1.4em;
	}
	.oritoku-shop span{
		font-size: 12px;
	}
	.oritoku-item{
		font-size: 20px;
		line-height: 1.5em;
	}
	.oritoku-rendou{
		
	}
	.btn-cd-rinji{
		width: 940px;
		margin: 2em auto;
		font-size: 30px;
	}

}

@media all and (max-width: 767px) {
	
	/*ENTRY*/
	#goodsentry-area{
		width: 100%;
		margin: 5% auto;
	}
	.goodsentry-list{
		display: flex;
		justify-content:center;
		flex-wrap: wrap;
	}
	.goodsentry-list li{
		width: 47%;
		margin: 0 1.5%;
	}
	
	/*DISC*/
	.discnav{
		width: 80%;
		margin: 5% auto 0;
		display: flex;
		justify-content:center;
		flex-wrap: wrap;
	}
	.discnav li{
		width: 20%;
		margin: 3% 3%;
	}
	.disc-title{
		margin: 0 auto 7%;
	}
	.disc-title-01,
	.disc-title-02,
	.disc-title-03,
	.disc-title-04{
		width: 98%;
	}
	.disc-title-05{
		width: 90%;
	}
	.disc-oritoku-wrap{
		width: 100%;
		margin: 0 auto;
	}
	.disc-oritoku-block{
		width: 45%;
		margin: 0 2.5% 10%;
	}
	.disc-oritoku-img{
		width: 100%;
		margin: 0 0 5%;
	}
	.disc-oritoku-caption{
		width: 100%;
		margin: 12px auto 0;
	}
	.disc-oritoku-type{
		font-size: 0.7em;
		margin: 0 0 4px;
	}
	.disc-oritoku-shop{
		font-size: 1em;
		margin: 0 0 2px;
		line-height: 1.3em;
	}
	.disc-oritoku-shop span{
		font-size: 0.8em;
	}
	.disc-oritoku-item{
		font-size: 0.8em;
		line-height: 1.4em;
	}
	.disc-tokuten-read{
		margin: 1em auto 1em;
	}
	.h4-tokuten{
		font-size: 1.4em;
		margin: 0.2em auto;
	}
	.disc-tokuten-list{
		width: 90%;
		font-size: 0.9em;	
		margin: 2em auto 0;
	}
	.disc-tokuten-list li{
		line-height: 1.6em;
		margin: 0 0 0.9em;
		list-style: disc !important;
	}
	.ccbd-tokuten-read{
		font-size: 0.9em;
	}
	
	#goodslist-area{
		width: 100%;
		margin: 2em auto;
	}
	.goods-list-wrap{
		width: 90%;
		margin: 0 auto;
		justify-content: space-between;
	}
	.goodsall-list{
		width: 44%;
		margin: 0 2% 6%;
	}
	.goodsall-img{
		width: 100%;
	}
	.goodsall-text{
		font-size: 0.9em;
		margin: 0.5em 0 0;
	}
	
	/*goodspage*/
	
	#goodscontent-area{
		width: 80%;
		margin: 2em auto;
		padding: 10% 5% 5%;
	}
	.cdcontent-area{
		width: 80%;
		margin: 2em auto;
		padding: 10% 5% 5%;
	}
	.goods-img{
		width: 90%;
		margin: 0 auto 1em;
	}
	.goods-caption{
		width: 90%;
		margin: 0 auto;
	}
	.goods-name{
		font-size: 1.2em;
		margin: 0 0 1em 0;
	}
	.goods-caption-list dt {
		font-size: 0.8em;	
	}
	.goods-caption-list dd {
		font-size: 0.9em;
	}
	.cd-name{
		width: 100%;
		font-size: 1.2em;
		margin: 0 0 1em 0;
	}
	.cd-oritoku{
		width: 90%;
		margin: 0 auto 40px;
		text-align: center;
	}
	.oritoku-wrap{
		width: 100%;
		margin: 0 auto;
	}
	.oritoku-block{
		width: 46%;
		margin: 0 2% 4em;
	}
	.oritoku-img{
		
	}
	.oritoku-shop{
		height: 3em;
		font-size: 0.8em;
		line-height: 1.4em;
		margin-bottom: 1em;
	}
	.oritoku-shop span{
		font-size: 0.6em;
	}
	.oritoku-item{
		font-size: 1em;
		line-height: 1.4em;
		
	}
	.oritoku-rendou{
		
	}
	.btn-cd-rinji{
		width: 80%;
		margin: 2em auto;
		font-size: 20px;
	}
	

}


/*	07.SPECIAL
============================== */

.special-header-report{
	color: #5091e5;
}
.moviebanner img,
.special-img img,
.special-comment-img img{
	width: 100%;
}
.special-page-header{
	text-align: center;
}
.special-mainimg img{
	width: 100%;
}
.special-mainimg{
}
.special-type{
	letter-spacing: 0.5em;
	font-weight: bold;
}
.special-title{
	line-height: 1.4em;
	letter-spacing: 0.1em;
}
.special-title small{
	font-size: 70%;
}
.special-report-comment{
	border-bottom: 1px solid #000;
}
.special-text small{
	font-size: 70%;
}
.stamp_table{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}
.stamp_table li img{
	width: 100%;
}
.news-h4{
	line-height: 1.4em;
}
.special-img-table{
	width: 100%;
	margin: 0 0 1em;
}
.special-img-table tr{
	padding: 0 2px;
}
.special-img-table td{
	width: 50%;
	padding: 0 2px;
	vertical-align: top;
	
}
.special-img-table td img{
	width: 100%;
}
.special-img-caption{
    width: 98%;
    font-size: 70%;
    margin: 0.5em auto 1em;
    line-height: 1.4em;
}

@media all and (min-width: 768px) {	
	#special-area{
		width: 950px;
		margin: 100px auto 100px;
		display: flex;
		flex-wrap: wrap;
	}
	.moviebanner{
		width: 48%;
		margin: 0 1% 60px;
	}
	.special-report-wrap{
		margin: 60px auto 80px;
	}
	.special-page-header{
		width: 950px;
		margin: 0 auto 24px;
	}
	.special-type{
		font-size: 14px;
		margin: 0 auto 12px;
	}
	.special-title{
		font-size: 28px;
	}
	.special-mainimg{
		width: 800px;
		margin: 0 auto 40px;
	}
	.report-contents{
		width: 720px;
		margin: 0 auto;
	}
	.special-img{
		width: 720px;
		margin: 0 auto 40px;
	}
	.special-text{
		font-size: 16px;
		line-height: 1.6em;
		margin: 0.5em auto 1.5em;
	}
	.special-report-comment{
		width: 720px;
		margin: 20px auto 40px;
		padding: 40px 0 60px;
	}
	.special-comment-img{
		width: 400px;
		margin: 0 auto 24px;
	}
	.special-comment-text{
		width: 680px;
		margin: 0 auto 0;
	}
	
	.stamp_table{
		width: 720px;
		margin: 0 auto;
	}
	.stamp_table li{
		width: 230px;
		margin: 5px;
	}
	.special-h4{
		font-size: 20px;
		margin: 2em 0 0.5em;
	}
	.twitter-movie{
		width: 550px;
		margin: 0 auto;
	}
}
@media all and (max-width: 767px) {
	#special-area{
		width: 100%;
		margin: 2em auto;
		padding: 5% 0% 5%;
	}
	.moviebanner{
		width: 70%;
		margin: 0 auto 3em;
	}
	.special-report-wrap{
		margin: 60px auto 80px;
	}
	.special-page-header{
		width: 90%;
		margin: 0 auto 24px;
	}
	.special-type{
		font-size: 0.6em;
		margin: 0 auto 12px;
	}
	.special-title{
		font-size: 1.1em;
	}
	.special-mainimg{
		width: 90%;
		margin: 0 auto 40px;
	}
	.report-contents{
		width: 80%;
		margin: 0 auto;
	}
	.special-img{
		width: 90%;
		margin: 0 auto 40px;
	}
	.special-text{
		font-size: 0.9em;
		line-height: 1.6em;
		margin: 0.5em auto 1.5em;
	}
	.special-report-comment{
		width: 100%;
		margin: 1em auto 2em;
		padding: 2em 0 3em;
	}
	.special-comment-img{
		width: 50%;
		margin: 0 auto 1em;
	}
	.special-comment-text{
		width: 100%;
		margin: 0 auto 0;
	}
	.special-h4{
		font-size: 0.9em;
		margin: 2em 0 0.5em;
	}
	.stamp_table li{
		width: 48%;
		padding: 1%;	
	}
}
