.mvcont{
	width: 100%;
	margin: 0 auto;
	position: relative;
}

.mvcont a,
.mvcont .app_read{
	position: absolute;
}
.mvcont a img{
	max-width: 100%;
}

.mv .mv-copy{
	font-size: 70%;
	padding: 0% 2% 1%;
	color: #fff;
	background: #ff790e;
	width: 100%;
	margin: 0 0;
	text-align: center;
}

.ranking,
.info_wrap{
	padding:4em 0 5em;
}

.ranking h3,
.new_comics h3,
.info_wrap h3{
	margin-bottom: 1em;
	text-shadow: 2px 2px 0px #fff;
}

.mv .tv-bannaer{
	width: 100%;
	text-align: center;
	margin: auto;
	padding: 2% 0 3% 0;
	background: #ff790e;
}

.mv .tv-bannaer img{	
	width: 90%;
	margin: auto;
	text-align: center;
	max-width: 563px;
}

@media screen and (min-width: 768.1px){
	.mv{
		background: #ff790e;
	}
	.mv picture img{
		max-width: 1366px;
		margin: auto;
		display: block;
	}
	.mvcont{
		max-width: 1366px;
		margin: auto;
	}
	.app_read{
		width: 25.12%;
		bottom: 0.9vw;
		left: 14.3%;
	}
	.icon_apple{
		width: 17.4%;
		bottom: 0.9vw;
		right: 24.2%;
	}
	.icon_googole{
		width: 17.4%;
		bottom: 0.9vw;
		right: 42.4%;
	}
}
@media screen and (max-width: 768px){
	.mvcont .app_read{
		width: 93%;
		left: 0;
		right: 0;
		margin: auto;
		bottom: 17.8vw;
	}
	.mvcont a{
		position: absolute;
		width: 45.8%;
	}
	.mvcont .icon_apple{
		left: 3.2vw;
		bottom: 3vw;
	}
	.mvcont .icon_googole{
		right: 3.2vw;
		bottom: 3vw;
	}
	
	.ranking h3,
	.new_comics h3,
	.info_wrap h3{
		font-size: 9vw;
	}
	
	.ranking,
	.info_wrap{
		padding:2em 0 3em;
	}
}

/*------------------------------------------------------*/
.news{
	background: #000;
	color: #fff !important;
	background:url(../images/ttl_bg.png) no-repeat, #000000;
	background:url(../images/ttl_bg.png) no-repeat, #000000;
	background:url(../images/ttl_bg.png) no-repeat, #000000;
	
	background-repeat: no-repeat;
/*
	background-image:url(../images/ttl_bg.png);
	background-repeat: no-repeat;
*/
}

.news .cont_inner{
	padding: 1.428em 0;
}

.news > div{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	background: url(../images/bg_news.png) no-repeat center left, -webkit-linear-gradient(left, #000000 50%, transparent 50%);
	background: url(../images/bg_news.png) no-repeat center left, -moz-linear-gradient(left, #000000 50%, transparent 50%);
	background: url(../images/bg_news.png) no-repeat center left, linear-gradient(to right, #000000 50%, transparent 50%);
	-webkit-background-size: contain !important;
	background-size: contain !important;
	width: 100%;
}

.news a{
	color: #fff;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}

.news a span{
	display: block;
	padding-right: 1em;
}

.news h3{
	font-size: 2.25em;
	padding-left: .5em;
}

.news ul{font-size: 1.15em; padding-left: 1.375em; width: 100%;}



@media screen and (min-width: 1000.1px){
	.news{
		background-position: 62vw top,center center !important;
		background:url(../images/ttl_bg.png) no-repeat, -webkit-linear-gradient(left, #222222 50%, #000000 50%);
		background:url(../images/ttl_bg.png) no-repeat, -moz-linear-gradient(left, #222222 50%, #000000 50%);
		background:url(../images/ttl_bg.png) no-repeat, linear-gradient(to right, #222222 50%, #000000 50%);
	}
	
}

@media screen and (max-width: 1000px) and (min-width: 768.1px){
	.news{
		background-position: 67vw top,center center !important;
		-webkit-background-size: 32vw,auto !important;
		background-size: 32vw,auto !important;
	}
}
@media screen and (max-width: 768px){
	.news h3{
		font-size: 5.5vw;
	}
	.news ul{
		font-size: 3vw;
	}
	.news a{
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.news a span{
		width: 100%;
	}
	.news{
		background:#000;
	}
	.news > div{
		background: url(../images/bg_news.png) no-repeat center left;
		-webkit-background-size: contain !important;
		background-size: contain !important;
		width: 100%;
	}
}


/*--------------------------------------------------*/
.ranking{
	background: url(../images/bg_dot.png) center center;
	
	padding-bottom: 5em;
}

.ranking_list{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-bottom: 5em
}

.ranking_list li{
	width: 48%;
	margin-right: 4%;
}

.ranking_list li a{
	border:5px solid #000;
	display: block;
	padding: 8.5%;
	background: #fff;
	position: relative;
	-webkit-box-shadow: 0 0 0 0 #555555;
	box-shadow: 0 4px 0 1px #555555;
	height: 100%;
}

.ranking_list li a:after{
	content:'';
	position: absolute;
	display: block;
	background-image: url(../images/icon_article.png);
	background-repeat: no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
	width: 51px;
	height: 52px;
	bottom:0;
	right: 0;
}

.ranking_list li a .ttl{
	font-weight: 600;
	margin-top: .5em;
}

.ranking_list li a .artist{
	margin-top: 1em;
	font-size: .857em;
}


.ranking_list li a .copy{
	margin-top: 1em;
	font-size: .714em;
}

@media screen and (max-width: 768px){
	.ranking_list li a:after{
		width: 15%;
		height: 15%;
	}
	.ranking{
		padding-bottom: 3em;
		-webkit-background-size: 200% !important;
		background-size: 200% !important;
		background-position: 50vw -10vw!important;
	}
	.ranking_list{
		margin-bottom: 3em;
	}
	.ranking_list li:nth-of-type(2n){
		margin-right: 0;
	}
	.ranking_list li{
		margin-top: 4%;
	}
	.ranking_list li:nth-child(-n+2){
		margin-top: 0;
	}
	.ranking_list li a .thum_txt{
		font-size: 3vw;
	}
}
@media screen and (min-width: 768.1px){

	.ranking_list li{
		width: 24%;
		margin-right: 1.3%;
	}
	.ranking_list li:nth-of-type(4n){
		margin-right: 0;
	}
	.ranking_list li a:after{
		width: 41px;
		height: 32px;
	}
}




/*-----------------------------------------------------------*/

.new_comics{
	background:url(../images/bg_arrow.png) no-repeat #ffa200;
	background-position: 11vw 0vw;
	-webkit-background-size: 125% !important;
	background-size: 110% !important;
	padding: 4em 0 5em;
}

.new_list{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-bottom: 5em
}

.new_list li{
	width: 31.4%;
	font-weight: 600;
	margin-right: 2.8%;
	margin-top: 2.8%;
}
.new_list li .thum_new img{
	display: block;
}
.new_list li .thum_new{
	border-bottom:5px solid #000;
}

.new_list li .new_txt{
	margin-top: 0.2em;
}

@media screen and (max-width: 768px){
	.new_comics{
		padding: 3em 0;
		background-position: 0vw -21vw;
		-webkit-background-size: 400vw !important;
		background-size: 400vw !important;
	}
	.new_list{
		margin-bottom: 3em;
	}
	.new_list li{
		margin-top: 5.5%;
	}
	.new_list li:nth-of-type(3n){
		margin-right: 0;
	}
	.new_list li:nth-child(-n + 3){
		margin-top: 0;
	}
	.new_list li .new_txt{
		font-size: 2.8vw;
	}
}
@media screen and (min-width: 768.1px){
	
	.new_list li{
		width: 14.3%;
	}
	.new_list li:nth-of-type(6n){
		margin-right: 0;
	}
	.new_list li:nth-child(-n + 6){
		margin-top: 0;
	}
}




/*-----------------------------------------------------------*/
.info_wrap{
	background: url(../images/bg_dot.png) center center;
}
.info_wrap .cont_inner{
	max-width:1000px !important;
	margin: auto;
	width: 100%;
}

.youtube {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
	margin-bottom:.725em ;
}
.youtube iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}

.tv {
	position: relative;
	width: 100%;
	padding-top: 6%;
/*	padding-top: 20%;	*/
	margin-bottom:.725em ;
}
.tv p{
	margin: auto;
	
}

@media screen and (max-width: 768px){
.tv p{
	width: 93%;
	
}	
}
.movie_ttl{
	font-size: 1.42em;
	color: #fff;
	background: #f1512f;
	padding: .3em 0;
	text-align: center;
}
.movie_body{
	font-size: 1.12em;
	padding:.725em 0;
	line-height: 1.6;
}
.twitter_ttl span{
	color: #00aced;
}

.twitter_tl{
	border:5px solid #eee;
	padding: 1%;
	background: #fff;
}

@media screen and (max-width: 768px){
	.info_wrap{
		-webkit-background-size: 200% !important;
		background-size: 200% !important;
		background-position: 50vw -10vw!important;
	}
	.movie{
		margin-bottom: 2em;
		width: 100%;
	}
	
	.youtube{
		width: 93%;
		margin-right: auto;
		margin-left: auto;
	}
	.movie_ttl{
		width: 93%;
		margin: auto;
	}
	.movie_body{
		padding: 3.5%;
		font-size: 19px;
	}
	.twitter_wrap{
		width: 93%;
		margin: 0 auto;
	}
}
@media screen and (min-width: 768.1px) and (max-width: 1000px){
	.info_wrap{
		padding-right: 3.5%;
		padding-left: 3.5%;
	}
}
@media screen and (min-width: 768.1px){
	.info_wrap .cont_inner{
		justify-content: space-between;
	}
	.info_wrap section{
		width: 48%;
	}
}


.banner_area {
	background:url(../images/bg_arrow.png) no-repeat #ffa200;
	background-position: 11vw 0vw;
	-webkit-background-size: 125% !important;
	background-size: 110% !important;
	padding: 4em 0 5em;
}

.banner_area ul{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-bottom: 1em;
}

.banner_area ul li{
	flex-basis: 23%;
	margin: 0 1% 2%;
}

.banner_area ul li img{
	width: 100%;
	max-width: 228px;
	}

@media screen and (min-width: 768.1px) and (max-width: 1000px){

.banner_area ul li{
	flex-basis: 23%;
	margin: 0 1% 2%;
}

.banner_area ul li img{
	width: 100%;
	max-width: 228px;
	}
}

@media screen and (max-width: 768px){
	.banner_area ul li img{
		width: 100%;
		max-width: 330px;
	}
	.banner_area ul li{
		margin: 0 2% 2%;
		flex-basis: 46%;
	}
}