@charset "UTF-8";
/* ------------------------- TOC
common setting
max-width: 480px
max-width: 768px


----------------------------- */
/* ============================== common setting */


/*---- max-width: 480px ----*/
@media (max-width: 480px) {


}


/*---- max-width: 768px ----*/
@media (max-width: 768px) {
.l-contents {
	overflow: hidden;
}
.category .radius-boxinn .imgL {
	float: none;
	max-width: 98%;
	padding: 0 1% 10px 1%;
	}
.category .radius-boxinn .imgR {
	float: none;
	max-width: 98%;
	padding: 0 1% 10px 1%;
	}
    #cboxTitle{
        font-size: 12px;
    }
    img {
        width: 100%;
        height: auto;
    }
    .drawer-toggle {
        display: block;
        background: rgba(0,0,0,0);
    }
    .drawer-overlay.drawer-toggle {
        display: none;
    }
	.top .l-nav .ov{
		display:block;
		width:100%;
		text-align: center;
		padding:0 10px;
		margin-bottom:10px;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	.top .l-nav .ov li{
		display: inline-table;
		width:32%;
		margin:0;
		background:none;
		padding:1px;
	}
	.top .l-nav .ov li a{
		display: table-cell;
		vertical-align: middle;
		background: url(../images/btn.png) no-repeat;
		-moz-background-size:cover;
		-webkit-background-size:cover;
		background-size:cover;
	}
	.top .l-nav .ov li a:hover{
		background: url(../images/btn.png) no-repeat;
		-moz-background-size:cover;
		-webkit-background-size:cover;
		background-size:cover;
	}
	.top .l-nav .ov li img{
		width:100%;
		vertical-align: bottom;
	}
	.top .l-nav .ov li a:hover img{
		opacity:1;
	}
/*    .l-nav　ul.sp {
        display: block;
    }*/
	.top .l-wrapper {
		background: #eb348f;
		min-width:0;
	}
	.l-wrapper .inner {
		width: 100%;
		margin: 0 auto 0;
	}
	.l-mainvidual{
		margin-bottom:10px;
	} 
	.l-mainvidual h1{
		display: block;
		text-align: center;
		background: url(../images/sp/bg_mainvidual_stage.png) top center no-repeat;
		-moz-background-size: cover;
		-webkit-background-size: cover;
		background-size: cover;
	}

	.l-mainvidual h1 img{
		width: 55%;
		vertical-align: bottom;
		margin: 0 auto;
	}
	.top .l-mainvidual .sublaed {		
        background: url(../images/sp/top_leadttl.png) no-repeat 0 0;
        -webkit-background-size: 100% auto;
        background-size: 100% auto;
        width: 100%;
        z-index: 5;
        height: 0;
        padding-top: 25%;
	}
	
	.top .info-area{
		padding: 0 10px;;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	.top .info-area,
	.top .info-area > *{
		display: block;
	}
    .top .l-information {
        width: 100%;
        margin: 0 0 20px;
		padding:0;
    }
    .top .l-information .inner {
        width: 100%;
        padding: 10px 15px 15px;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
    }
    .top .l-information .inner .leedttl {
		display: block;
		background: url(../images/top_info_lead.png) no-repeat left top;
        -webkit-background-size: contain;
        background-size: contain;
        width: 100%;
		height: 25px;
        padding-top: 0;
        margin: 0 0 5px;
    }
    .top .l-information .inner .scroll-box {
        border: 3px solid #fc5aaa;
        padding: 2.5% 2.5% 0;
        overflow-y: scroll;
        height: 120px;
    }
    .top .l-information .inner .scroll-box .inner dl {
        margin-bottom: 2.5%;
        padding-bottom: 2.5%;
    }
    .top .l-information .inner .scroll-box .inner dl dt,
    .top .l-information .inner .scroll-box .inner dl dd {
        font-size: 1.1em;
    }
	

	.top .info-area .movie-area{
		width: 100%;
		padding: 10px 15px 15px;
		background-color: #f69dc9;
		border-radius: 20px;
	}

.top .info-area .movie-area .movie-inner{
	border-radius: 0;
    padding:0;
}
	.top .info-area .movie-area .leedttl {
		background: url(../images/top_movie_lead.png) no-repeat left top;
        background-size: contain;
		width: 100%;
		height: 25px;
		margin:0 0 8px;
	}
	.top .info-area .movie-area a{
		display: block;
		width:100%;
		max-width:300px;
		margin: auto;
		position: relative;
		border-radius: 20px;
		overflow: hidden;
		box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
	}
	.top .info-area .movie-area a:before{
		content:"";
		position: absolute;
		width:100%;
		height: 100%;
		left:0;
		top:0;
		background: rgba(0,0,0,0.6) url(../movie/playback.gif) center center no-repeat;
		background-size: 80px 80px;
		opacity:.7;
	}
	.top .info-area .movie-area a:hover:before{
		background: rgba(0,0,0,0.6)url(../movie/playback.gif) center center no-repeat;
		background-size: 78px 78px;
	}
	.top .info-area .movie-area img{
		width: 100%;
		vertical-align: middle;
	}	
    .top .btn_event {
		margin: 4% auto 0;
		width: 95%;
		height: auto;
    }
    .top .btn_event a {
        display: block;
        width: 100%;
        height: auto;
    }
    .banner_area {
        width: 94%;
        margin: 0 auto 4.5%;
    }
    .banner_area ul li {
        float: left;
        width: 49%;
        margin: 0 1% 1.2% 0;
        font-size: 0;
        line-height: 0;
    }
    .banner_area ul li:last-of-type {
        margin-right: 0;
    }
    .top .l-footer {
        background: #fff url(../images/sp/bg_img_footer.png) no-repeat center top;
        background-size: cover;
        padding-bottom: 6.5%;
    }
    .top .l-footer .inner {
        width: 100%;
        height: 0;
        margin: 0 auto 0;
        padding-top: 1%;
        padding-bottom: 3%;
    }
    .top .l-footer .copyright {
        padding-top: 2%;
        font-size: 1rem;
    }
    .category .l-wrapper {
		min-width: 0;
    	background: #0e3e82 url(../images/sp/miracletunes_gaiyou_SP.png) no-repeat center top;
    	background-size: 100% auto;
    }
    .l-wrapper .inner {
    	width: 100%;
    }
    .category .l-nav ul {
    	width: 100%;
    	display: none;
    }
    .category .l-contents .leedttl {
        background: url(../images/sp/category_pagettl.png) no-repeat left 50%;
        background-size: 65% auto;
        width: 100%;
        height: auto;
        margin: 0 auto 0;
    }
    .category .l-contents .leedttl a {
    	width: 60%;
        height: 0;
        padding-top: 20.5%;
    }
.btn_detail img {
	width: 100%;
	} 
.radius-boxinn .photosideL {
	float: none;
	width: 100%;
	}
.radius-boxinn .photosideL img {
	max-width: 100%;
	}
.radius-boxinn .textsideR {
	float: none;
	width: 100%;
	}
.radius-boxinn .textsideR p:last-child {
	padding-top: 20px;
	}
.radius-boxinn .photosideR {
	float: none;
	width: 100%;
	}
.radius-boxinn .photosideR img {
	max-width: 100%;
	}
.radius-boxinn .textsideL {
	float: none;
	width: 100%;
	}
.radius-boxinn .textsideL p:last-child {
	padding-top: 20px;
	}

.about .lead-block {
        width: 95%;
        margin: 6.5% auto 20px;
       	padding: 5% 7.5% 5%;
		box-sizing: border-box;
    }
    .about .lead-block .sublaed {
        background: url(../images/sp/about_leadttl.png) no-repeat 0 0;
    	background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 11.5%;
        margin-bottom: 2.5%;
    }
    .about .lead-block .lead-txt {
        background: url(../images/sp/about_leadtxt.png) no-repeat 0 0;
    	background-size: 100% auto;
       	width: 100%;
        height: 0;
        padding-top: 26.5%;
    }
    .about .contents-block {
        width: 95%;
        margin: 0 auto 3%;
        padding: 5% 7.5% 20px;
		box-sizing: border-box;
    }
    .about .contents-block .sublaed {
        background: url(../images/sp/about_contentsttl.png) no-repeat 0 0;
    	background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 12%;
        margin-bottom: 4.5%;
    }
    .about .contents-block .ct-txt {
        background: url(../images/sp/about_contentstxt.png) no-repeat 0 0;
    	background-size: 100% auto;
       	width: 100%;
        height: 0;
        padding-top: 126.5%;
    }
    .about .song-block {
        width: 95%;
        margin: 0 auto 5.5%;
       	padding: 5% 7.5% 5%;
		box-sizing: border-box;
    }
    .about .song-block .sublaed {
        background: url(../images/sp/about_songttl.png) no-repeat 0 0;
    	background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 12.72%;
        margin-bottom: 2.5%;
    }
    .about .song-block .lead-txt {
        background: url(../images/sp/about_songtxt.png) no-repeat 0 0;
    	background-size: 100% auto;
       	width: 100%;
        height: 80px;
        padding-top: 35.27%;
    }
    .about .back-btn {
        position: absolute;
        bottom: -6.5% !important;
    }
    .category .back-btn {
        position: absolute;
        right: 0;
        bottom: -2.5%;
        z-index: 100;
        width: 25%;
        /* height: 101px; */
    }
    .category .back-btn a {
        display: block;
        background: url(../images/sp/btn_pageback.png) no-repeat 0 0;
       	background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
       	height: 0;
        padding-top: 110%;
    }
    .category .l-footer-wrap {
        /* background: none; */
        padding-top: 12%;
    }
    .category .l-footer {
        background-image: url(../images/sp/bg_img_footer.png);
        background-color: #fff;
        border-top: none;
        padding-bottom: 0.5%;
    }
    .category .l-footer .inner {
        width: 100%;
        height: 35px;
        margin: 0 auto 0;
        /* padding-top: 10%; */
    }
    .category .l-footer .copyright {
        padding-top: 3.5%;
        font-size: 1rem;
    }
    .category .radius-box01 {
        padding: 4.5% 3.5% 5%;
    }
    .category .radius-boxinn {
        padding: 3.5% 4% 3.5%;
    }
    .cast .cast-lead {
        background: url(../images/sp/bg_cast_radius02.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 87%;
        margin: 6.5% auto 3%;
       	padding: 4.5% 5.5% 10.5%;
    }
    .cast .cast-lead .sublaed {
        background: url(../images/sp/cast_leadttl.png) no-repeat 0 0;
    	background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 52.5%;
        margin-bottom: 1.5%;
    }
		 .cast .cast-lead .sublaed02 {
        background: url(../images/sp/cast_leadttl02.png) no-repeat 0 0;
    	background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 37.5%;
        margin: 1.5% 0;
    }
    .cast .cast-lead ul {
    	margin-left: 0;
		width:100%;
    }
    .cast .cast-lead ul li img {
    	display: none;
    }
    .cast .cast-lead ul li:nth-child(1) {
    	background: url(../images/sp/img_plofile_purple.png) no-repeat 0 0;
    	background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
    	padding-top: 53.5%;
        content: "神咲マイ（足立涼夏） 中学２年生 しっかりものの トップアイドル！ イメージカラー：紫";
    }
    .cast .cast-lead ul li:nth-child(2) {
    	background: url(../images/sp/img_plofile_pink.png) no-repeat 0 0;
    	background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
    	padding-top: 53.5%;
        content: "一ノ瀬カノン（内田亜紗香） 小学6年生 おっちょこちょいだけど 明るく元気な主人公！ イメージカラー：ピンク";
    }
    .cast .cast-lead ul li:nth-child(3) {
    	background: url(../images/sp/img_plofile_blue.png) no-repeat 0 0;
    	background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
    	padding-top: 53.5%;
        content: "橘フウカ（小田柚葉） 中学1年生 クールだけど 実は天才ダンサー イメージカラー：青";
    }
		 .cast .cast-lead ul.ov02 li:nth-child(1) {
    	background: url(../images/sp/img_plofile_gold.png) no-repeat 0 0;
    	background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
    	padding-top: 53.5%;
        content: "白鳥アカリ（薄倉里奈） 中学1年生 ヒカリの姉";
    }
		.cast .cast-lead ul.ov02 li:nth-child(2) {
    	background: url(../images/sp/img_plofile_silver.png) no-repeat 0 0;
    	background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
    	padding-top: 53.5%;
        content: "白鳥ヒカリ（西山未桜） 中学1年生 アカリの妹";
    }
    .cast .cast-contents {
        background: url(../images/sp/bg_cast_radius01.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 83%;
        margin: 0 auto;
       	padding: 4.5% 4.5% 17.5%;
    }
    .cast .cast-contents .sublaed {
        background: url(../images/sp/cast_contentsttl.png) no-repeat 0 0;
    	background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 36.5%;
        margin-bottom: 3.5%;
    }
    .cast .cast-contents ul {
    	margin-left: 0;
    	text-align: center;
    }
    .cast .cast-contents ul li {
    	float: none;
    	display: inline-block;
    	width: 48%;
    }
    .cast .cast-contents ul li img {
    	display: none;
    }
    .cast .cast-contents ul li:nth-child(1) {
    	background: url(../images/sp/img_ch_purple.png) no-repeat 0 0;
    	background-size: 100% auto;
        -webkit-background-size: 100% auto;
    	padding-top: 70%;
    }
    .cast .cast-contents ul li:nth-child(2) {
    	background: url(../images/sp/img_ch_pink.png) no-repeat 0 0;
    	background-size: 100% auto;
        -webkit-background-size: 100% auto;
    	padding-top: 70%;
    }
    .cast .cast-contents ul li:nth-child(3) {
    	background: url(../images/sp/img_ch_blue.png) no-repeat 0 0;
    	background-size: 100% auto;
        -webkit-background-size: 100% auto;
    	padding-top: 70%;
    }
    .cast .cast-contents ul.ov02 li:nth-child(1) {
    	background: url(../images/sp/img_ch_gold.png) no-repeat 0 0;
    	background-size: 100% auto;
        -webkit-background-size: 100% auto;
    	padding-top: 70%;
    }
    .cast .cast-contents ul.ov02 li:nth-child(2) {
    	background: url(../images/sp/img_ch_silver.png) no-repeat 0 0;
    	background-size: 100% auto;
        -webkit-background-size: 100% auto;
    	padding-top: 70%;
    }
	
	.staff-area{
		padding: 0 4.5%;
	}
	.staff-area .contents-box {
		width: 100%;
	}
	.staff-area .cast-staff{
		width: 100%;
		padding: 20px;
	}
	.cast .staff-area dl,
	.cast .staff-area dl > *{
		display: block;
		width: 100% !important;
		font-size: 16px;
		font-weight: normal !important;
		text-align: left !important;
		box-sizing: border-box;
	}
	.cast .staff-area dl dt{
		font-weight: bold !important;
	}
	.cast .staff-area .casts dl dt{
		padding-left: 1em;
		text-indent: -1em;
	}
	.cast .staff-area .staff dl dt{
		display: block !important;
		width: 100%;
	}
	.cast .staff-area .casts dl dt:after{
		content:"";
	}
	.cast .staff-area dl dt span{
		display: block !important;
		width: 100%;
		padding-left: 1em;
	}
	.cast .staff-area .casts dl dd{
		text-align: right !important;
	}
	.cast .staff-area .staff dl dd{
		padding-left: 1em;
	}
	
	.cast .chara .sublaed,
	.cast .casts .sublaed,
	.cast .staff .sublaed {
		width: 100%;
		height: 0;
		padding-top: 14.5%;
		margin-bottom: 3.5%;
	}
	
	.cast .chara .sublaed {
		background: url(../images/sp/cast/cast_sp_ttl05.png) no-repeat 0 0;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	.cast .casts .sublaed {
		background: url(../images/sp/cast/cast_sp_ttl03.png) no-repeat 0 0;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	.cast .staff .sublaed {
		background: url(../images/sp/cast/cast_sp_ttl04.png) no-repeat 0 0;width: 100%;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	
	.cast .chara .chara-list {
		width: 100%;
		margin: 0;
		table-layout: fixed;
	}
	.cast .chara .chara-list li .ttl {
		width: auto;
		padding: 10px 0;
		color: #ff058a;
		font-size: 16px;
		font-weight: bold;
	}
	.cast .chara .chara-list li .thumb {
		width: 40%;
		padding: 10px 0 10px 10px;
	}
	.cast .chara .chara-list li .thumb img {
		vertical-align: middle;
	}
	
	.cast .staff dl{
		margin-bottom:15px;
	}

	.cast .back-btn {
    	bottom: -1% !important;
	}
	
    .message .contents-box {
        width: 83%;
        margin: 6.5% auto 3%;
    }
    .message .message-lead {
        width: 100%;
    }
    .message .message-lead .sublaed {
        background: url(../images/sp/message_leadttl.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 11.5%;
    }
    .message .message-contents {
        width: 90%;
    }
    .message .message-contents .sublaed {
        background: url(../images/sp/message_leadtxt.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 84%;
        height: 0;
        padding-top: 4.5%;
    }
    .message .message-contents ul li img {
        display: none;
    }
    .message .message-contents ul li:nth-child(1) {
        background: url(../images/sp/img_message_pink.png) no-repeat 0 0;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        padding-top: 51%;
        content: "橘フウカ（小田柚葉）　フウカの役に選ばれてとても嬉しいです。フウカは天才ダンサーの役なので、よりダンスのスキルをあげられるようにがんばります。";
    }
    .message .message-contents ul li:nth-child(2) {
        background: url(../images/sp/img_message_purple.png) no-repeat 0 0;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        padding-top: 51%;
        content: "一ノ瀬カノン（内田亜紗香）　カノンと私はおっちょこちょいなところが似ているので、演じやすいと思います。 つねに笑顔で元気にがんばりたいです。";
    }
    .message .message-contents ul li:nth-child(3) {
        background: url(../images/sp/img_message_blue.png) no-repeat 0 0;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        padding-top: 51%;
        content: "橘フウカ（小田柚葉） 中学1年生 クールだけど 実は天才ダンサー イメージカラー：青";
    }
    .message .message-contents .txt {
        background: url(../images/sp/message_conttxt.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 37.5%;
    }
    .message .back-btn {
        bottom: -4.5%;
        /* height: 101px; */
    }
	.news .l-wrapper {
		min-width: 0;
	}
    .news .contents-box {
        width: 83%;
        margin: 6.5% auto 3%;
    }
    .news .news-lead {
        width: 100%;
    }
    .news .news-lead .sublaed {
        background: url(../images/sp/news/news_leadttl.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 11.5%;
    }
    .news .news-contents {
        width: 90%;
        margin-bottom: 3.5%;
    }
    .news .news-contents .inner {
        width: 100%;
        margin-bottom: 5.5%;
    }
    .news .news-contents ul.ph {
        margin-top: 3.5%;
    }
    .news .news-contents ul.ph li {
        margin-right: 2.5%;
    }
    .news .news-contents ul.img-left {
        margin-top: 3.5%;
    }
    .news .news-contents ul.img-left li {
        margin-right: 1.5%;
    }
    .news .news-contents ul.img-left li.last {
        margin-right: 0;
    }
    .news .news-contents .date {
        margin-bottom: 1.5%;
    }
    .news .news-contents .date {
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 40%;
        height: 0;
        padding-top: 8.5%;
    }
    .news .news-contents .btn a {
        display: block;
        width: 100%;
        height: auto;
    }
    .news .news-contents .btn a:hover img {
        position: relative;
        bottom: 0;
    }
		
		.news .date.tx {
			width: auto;
			height: auto;
			margin: 0 0 8px 0;
			padding: 0 10px;
			font-size: 14px;
		}
		.news .sublaed.tx {
			margin: 0 0 5px 0;
			font-size: 16px;
		}
		.news .txt {
			font-size: 13px;
		}

    .news .date170331 .sublaed {
        background: url(../images/sp/news/date_lead_20170331.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 14.5%;
        margin-bottom: 2.5%;
    }
    .news .date170331 .txt01 {
        background: url(../images/sp/news/date_txt_20170331.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 19.6%;
        margin-bottom: 2.5%;
    }
    .news .date170331 .campaign_btn {
        margin-top: 3.5%;
    }

    .news .date170215 .sublaed {
        background: url(../images/sp/news/date_lead_20170215.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 15.5%;
        margin-bottom: 2.5%;
    }
    .news .date170215 .txt01 {
        background: url(../images/sp/news/date_txt_20170215.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 19.14%;
        margin-bottom: 2.5%;
    }
  
  
  
    .news .date170114 .sublaed {
        background: url(../images/sp/news/date_lead_20170114.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 85%;
        height: 0;
        padding-top: 7.5%;
        margin-bottom: 2.5%;
    }
    .news .date170114 .txt01 {
        background: url(../images/sp/news/date_txt_20170114.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 27.8%;
        margin-bottom: 2.5%;
    }
    .news .date161201 .sublaed {
        background: url(../images/sp/news/date_lead_20161201.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 22.5%;
        margin-bottom: 2.5%;
    }
    .news .date161201 .txt01 {
        background: url(../images/sp/news/date_txt_20161201.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 26.5%;
        margin-bottom: 2.5%;
    }
    .news .date161028 .sublaed {
        background: url(../images/sp/news/date_lead_20161028.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 15.5%;
        margin-bottom: 2.5%;
    }
    .news .date161028 .txt01 {
        background: url(../images/sp/news/date_txt_20161028.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 26.5%;
        margin-bottom: 2.5%;
    }
    .news .date161003 .sublaed {
        background: url(../images/sp/news/date_lead_20161003.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 15.5%;
        margin-bottom: 2.5%;
    }
    .news .date161003 .txt01 {
        background: url(../images/sp/news/date_txt_20161003.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 26.5%;
        margin-bottom: 2.5%;
    }
    .news .date160903 .sublaed {
        background: url(../images/sp/news/date_lead_20160903.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 15.5%;
        margin-bottom: 2.5%;
    }
    .news .date160903 .txt01 {
        background: url(../images/sp/news/date_txt_20160903.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 53.5%;
        margin-bottom: 2.5%;
    }
    .news .date160821 .sublaed.tl01 {
        background: url(../images/sp/news/date_lead01_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 13.5%;
        margin-bottom: 2.5%;
    }
    .news .date160821 .sublaed.tl02 {
        background: url(../images/sp/news/date_lead02_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 15.5%;
        margin-bottom: 2.5%;
    }
    .news .date160821 .sublaed.tl03 {
        background: url(../images/sp/news/date_lead03_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 23.5%;
        margin-bottom: 2.5%;
    }
    .news .date160821 .txt01 {
        background: url(../images/sp/news/date_txt01_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 67.5%;
        margin-bottom: 2.5%;
    }
    .news .date160821 ul.ph li {
        width: 29.5%;
    }
    .news .date160821 .col {
        margin-bottom: 3.5%;
        padding-top: 2.5%;
    }
    .news .date160821 .col .img-left {
        float: none;
    }
    .news .date160821 .col .img-left img {
        display: none;
    }
    .news .date160821 .pink .img-left {
        background: url(../images/sp/news/date_pink_20160821.png) no-repeat 0 0;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        padding-top: 49%;
        margin-bottom: 1.5%;
        content: "一ノ瀬カノン（内田亜紗香）";
    }
    .news .date160821 .purple .img-left {
        background: url(../images/sp/news/date_purple_20160821.png) no-repeat 0 0;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        padding-top: 49%;
        margin-bottom: 1.5%;
        content: "神咲マイ（足立涼夏）";
    }
    .news .date160821 .blue .img-left {
        background: url(../images/sp/news/date_blue_20160821.png) no-repeat 0 0;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        padding-top: 49%;
        margin-bottom: 1.5%;
        content: "橘フウカ（小田柚葉）";
    }
    .news .date160821 .col .ct-lead {
        margin-bottom: 3.5%;
    }
    .news .date160821 .pink .ct-lead.txt01 {
        background: url(../images/sp/news/iv_txt01_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 21.5%;
    }
    .news .date160821 .pink .ct-lead.txt02 {
        background: url(../images/sp/news/iv_txt02_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 19.5%;
    }
    .news .date160821 .pink .ct-lead.txt03 {
        background: url(../images/sp/news/iv_txt03_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 16.5%;
    }
    .news .date160821 .pink .ct-lead.txt04 {
        background: url(../images/sp/news/iv_txt10_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 21.5%;
    }
    .news .date160821 .pink .ct-lead.txt05 {
        background: url(../images/sp/news/iv_txt11_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 21.5%;
    }
    .news .date160821 .purple .ct-lead.txt01 {
        background: url(../images/sp/news/iv_txt04_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 21.5%;
    }
    .news .date160821 .purple .ct-lead.txt02 {
        background: url(../images/sp/news/iv_txt05_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 20.5%;
    }
    .news .date160821 .purple .ct-lead.txt03 {
        background: url(../images/sp/news/iv_txt06_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 20.5%;
    }
    .news .date160821 .purple .ct-lead.txt04 {
        background: url(../images/sp/news/iv_txt12_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 15.5%;
    }
    .news .date160821 .purple .ct-lead.txt05 {
        background: url(../images/sp/news/iv_txt13_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 16.5%;
    }
    .news .date160821 .blue .ct-lead.txt01 {
        background: url(../images/sp/news/iv_txt07_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 28.5%;
    }
    .news .date160821 .blue .ct-lead.txt02 {
        background: url(../images/sp/news/iv_txt08_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 21.5%;
    }
    .news .date160821 .blue .ct-lead.txt03 {
        background: url(../images/sp/news/iv_txt09_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 21.5%;
    }
    .news .date160821 .blue .ct-lead.txt04 {
        background: url(../images/sp/news/iv_txt14_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 21.5%;
    }
    .news .date160821 .blue .ct-lead.txt05 {
        background: url(../images/sp/news/iv_txt15_20160821.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 80%;
        height: 0;
        padding-top: 19.5%;
    }
    .news .date160821 .blue01 li img {
        display: none;
    }
    .news .date160821 .blue01 li:nth-child(1) {
        width: 69%;
        vertical-align: top;
    }
    .news .date160821 .blue01 li:nth-child(2) {
        width: 26.5%;
        vertical-align: top;
        margin-right: 0;
    }
    .news .date160821 .blue01 li:nth-child(1) a {
        background: url(../images/sp/news/date_ph04_20160821.png) no-repeat 0 0;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 57.2%;
        margin-bottom: 0;
        content: "";
        display: block;
    }
    .news .date160821 .blue01 li:nth-child(2) a {
        background: url(../images/sp/news/date_ph05_20160821.png) no-repeat 0 0;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 150%;
        margin: 0 0 0 0;
        content: "";
        display: block;
    }
    .news .date160821 .blue02 li img {
        display: none;
    }
    .news .date160821 .blue02 li:nth-child(1) {
        background: url(../images/sp/news/date_ph06_20160821.png) no-repeat 0 0;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 65%;
        height: 0;
        padding-top: 43%;
        margin-bottom: 1.5%;
        content: "";
    }
    .news .date160803 .sublaed {
        background: url(../images/sp/news/date_lead_20160803.png) no-repeat left top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 70%;
        height: 0;
        padding-top: 7.5%;
    }
    .news .date160803 .col .text-unit .txt01 {
        background: url(../images/sp/news/date_txt_20160803.png) no-repeat left top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 24.5%;
    }
    .news .date160803 .col .img-left {
        width: 100%;
        float: none;
    }
    .news .date160803 .col .img-left li {
        width: 48%;
    }
    .news .date160803 .col {
        display:-webkit-box;
        display: -webkit-flex;
        display:-ms-flexbox;
        display: flex;
        -webkit-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    }
    .news .date160803 .col .img-left {
        -webkit-box-ordinal-group:2;
        -ms-flex-order:2;
        -webkit-order:2;
        order:2;
    }
    .news .date160803 .col .text-unit {
        -webkit-box-ordinal-group:1;
        -ms-flex-order:1;
        -webkit-order:1;
        order:1;
        margin-bottom: 3.5%;
    }
    .news .date151201 .sublaed {
        background: url(../images/sp/news/date_lead_20151201.png) no-repeat left top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 85%;
        height: 0;
        padding-top: 7.5%;
    }
    .news .date151201 .txt01 {
        background: url(../images/sp/news/date_txt_20151201.png) no-repeat center top;
        background-size: 100% auto;
        -webkit-background-size: 100% auto;
        width: 100%;
        height: 0;
        padding-top: 19.5%;
    }
    .news .date151201 .col .img-left {
        width: 100%;
    }
    .news .date151201 .col .img-left li {
        width: 31%;
    }
    .news .l-footer-wrap {
        /* background: none; */
        padding-top: 18%;
}


/* ============================== event */

	.category.event .event_inner{
		font-size: 12px;	
	}
	.category.event .event_inner p{
		margin-bottom: 2em;
	}
	.event .event_inner .eventdetail h4 {
	width: 100%;
	float: none;
	display: block;
}
.event .event_inner .eventdetail dl {
	clear: both;
	width: 90%;
	float: none;
	padding-left: 6%;
	display: block;
}
.event .event_inner .eventdetail dl dt {
	width: 100%;
}
.event .event_inner .eventdetail dl dd {
	width: 90%;
	padding-left: 6%;
}
	.category.event .event170113 .sublaed{
		width: 100%;
		max-width: 400px;
		height: auto;
		margin: 0 auto 5%;
	}
    .category.event .back-btn {
        position: absolute;
        right: 0;
        bottom: 3%;
        z-index: 100;
        width: 25%;
    }
    .category.event .back-btn a {
        display: block;
        background: none;
        width: 100%;
        padding-top: 0;
    }

    /* ============================== campaign */
    .category.campaign .event_inner{
        font-size: 20px;
				word-break: break-all;
    }
    .category.event .event170113 .sublaed{
        max-width: 500px;
    }
    .campaign .center_li {
        text-align: center;
        margin-bottom: 6.5%;
    }
    .campaign .center_li li {
        padding: 0 0 4.5% 0;
    }
    .campaign .center_li li:last-of-type {
        padding-bottom: 0;
    }
    .campaign .center_li li img {
        width: 90%;
        display: block;
        margin: 0 auto;
    }


/* ============================== movie */
.movie-list{
	width:100%;
	padding-right:13px;
}
.movie-list *{
	box-sizing: border-box;
}
.movie-list:after{
	content: "";
	display: block;
	clear: both;
}
.movie-list li{
	width: 100%;
	float: none;
    border-radius: 10px;
	padding: 10px;
	margin: 0 0 5%;
}
.movie-list li:nth-child(even){
	float: none;
}
.movie-list li:last-child{
	margin-bottom: 0 !important;
}
.movie-list li .movie_link{
	display: block;
	width:100%;
	max-width: 330px;
	padding:0;
	margin:5px auto;
}
	
	
	
	#promotion .news-lead .sublaed {
		background: url(../images/sp/movie/movie_sp_ttl01.png) no-repeat 0 0;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	#making .news-lead .sublaed {
		background: url(../images/sp/movie/movie_sp_ttl02.png) no-repeat 0 0;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
		padding-top:19%;
	}

	
.movie-list .date{
    width: 40%;
	height: 0;
	padding-top:8%;
}
.movie-list .date170117 {
	background: url(../images/news/date_ic_20170117.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie-list .date170119 {
	background: url(../images/news/date_ic_20170119.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie-list .date170126 {
	background: url(../images/news/date_ic_20170126.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie-list .date170202 {
	background: url(../images/news/date_ic_20170202.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie-list .date170209 {
	background: url(../images/news/date_ic_20170209.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie-list .date170216 {
	background: url(../images/news/date_ic_20170216.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie-list .date170323 {
	background: url(../images/news/date_ic_20170323.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie-list .sublaed {
	width: 100%;
	height: 62px;
	margin-bottom: 0;
	height: 0;
	padding-top: 12%;
}
.movie-list #movie01 .sublaed{
	background: url(../images/sp/movie/ttl_sp_movie01.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie-list #movie02 .sublaed{
	background: url(../images/sp/movie/ttl_sp_movie02.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie-list #chaochao01 .sublaed{
	background: url(../images/sp/movie/ttl_sp_chaochao01.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie-list #chaochao02 .sublaed{
	background: url(../images/sp/movie/ttl_sp_chaochao02.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie-list #chaochao03 .sublaed{
	background: url(../images/sp/movie/ttl_sp_chaochao03.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie-list #chaochao04 .sublaed{
	background: url(../images/sp/movie/ttl_sp_chaochao04.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie-list #chaochao05 .sublaed{
	background: url(../images/sp/movie/ttl_sp_chaochao05.png) no-repeat left top;
    -webkit-background-size: 100% auto;
  	background-size: 100% auto;
}
.movie .back-btn {
    bottom: -2.5%;
}

/* movie-list */
.movie-list .date{
    width: 40%;
	height: 0;
	padding-top:8%;
}
.movie-list .text {
	}
.movie-list .text .date {
	font-size: 14px;
	height: inherit;
	padding-top: 0%;
	}
.movie-list .text .date span {
	}
.movie-list .text h2 {
	margin: 0 0 10px 0;
	font-size: 14px;
	line-height: 1.7;
}

.book .contents-box{
  width:auto;
}
.book .book-lead {
    width: 100%;
}
.book .book-lead .sublaed {
    background: url(../images/book/sp/book_leadttl.png) no-repeat center top;
    background-size: 100% auto;
    -webkit-background-size: 100% auto;
    width: 100%;
    height: 0;
    padding-top: 11.5%;
}
  
.category .radius-boxinn.book-contents{
  padding-bottom:5%;
}
.book-contents,
.book-contents > *{
  display:block;
}
.book-contents > p{
  width:100%;
  padding:0;
  margin-bottom:10px;
}
.book-contents > p img{
  display:block;
  width:100%;
  max-width: 240px;
  margin: 0 auto;
}  
  
  
.book-contentsB h3 {
	font-size: 18px;
	}
/*.book-contentsB h4 {
	font-size: 18px;
	}
.book-contentsB h5 {
	font-size: 16px;
	}
.book-contentsB p {
	font-size: 14px;
	}
.book-contentsB ul ,
.book-contentsB ol {
	font-size: 14px;
}
  */
.book-contentsB .imgR {
	float: none;
	max-width: 80%;
	padding: 0px 10% 10px 10%;
}
  
.campaign_h2{
  font-size:28px;
}
  
  
  
  
/* ============================== utility */
	.pc{
		display: none !important;
	}	
	.sp{
		display: block !important;
	}
	
} /* end */


/*---- max-width: 480px ----*/
@media (max-width: 480px) {
.movie-list .text h2 {
	/*max-height: 44px;*/
	}
}
