@charset "UTF-8";
/* ==========================================================
	common.css
	display: PC and Tab
========================================================== */
*,
*:before,
*:after {
	box-sizing: border-box;
	outline: none;
	-moz-outline: none;
}
.clear:before,
.clear:after{
	display: table;
	content: "";
}

/* global-nav highLight
----------------------- */
@media screen and (min-width: 768px) {
	#menu .global-nav-news a{
		color: #00EFE0;
	}
}
@media screen and (max-width: 767px) {
	#navi-list .global-nav-news a{
		color: #FFF;
		background: #00EFE0;
	}
}

/* ==============
	@CONTENTS AREA
================ */
@media screen and (max-width: 767px) {
	#contents-area{
		padding: 0 2%;
	}
}

#news h1 {
	width: 870px;
	font-size: 2.8rem;
	font-weight: bold;
	border-bottom: 4px solid #000;
	padding: 0 0 8px;
/*	Faisal
margin: 46px 0 29px;
*/	margin: 0 0 29px 0;
}
#news h1 span{
	font-size: 1.4rem;
	font-weight: bold;
	padding: 0 0 0 13px;
}

/* live wire heading
----------------------- */
#news .livewireH2 h2,
.content-box h3{
padding: 12px 18px;
font-size: 1.8rem;
background-color: #1a1a1a;
color: #fff;
line-height: 1.45;
}
#news .livewireH2 h2{
	padding: 12px 105px 12px 18px;
	border: none;
	font-size: 2.8rem;
	font-weight: bold;
}

.h3-mtv-btn{
	position: relative;
}
.h3-mtv-btn a{
	position: absolute;
	top: 20px;
	right: 13px;
	padding: 7px;
	background-color: #d9d9d9;
	color: #1a1a1a !important;
	font-size: 100% !important;
	font-weight: bold;
}
.h3-mtv-btn a:hover{
	text-decoration: none;
}

/* link tag styles
----------------------- */
#contents-area a{
	color: #00efe4;
	font-weight: bold;
}
#contents-area a:hover{
	text-decoration: none;
}

.content-box{
	max-width: 870px;
}
.content-box p,
.content-box span,
.tab-contents p,
.tab-contents span {
	font-size: 1.2rem;
	line-height: 1.575;
}

#contents-area .btn-more a{
	color: #FFF;
}
#contents-area .btn-more a:hover{
	color: #00efe4;
}
#contents-area .btn-archive{
	display: none;
}
#contents-area .btn-archive a {
	padding: 5px 80px;
	font-size: 1.2rem;
	color:#fff;
}

/* left area
----------------------- */
.left-area h1,
.headingLv1 {
	margin: 0;
	font-size: 2.8rem !important;
	font-weight: bold;
	line-height: 1.5;
	border-bottom: 4px solid #1a1a1a;
}
.left-area h1 span,
.headingLv1 span {
	font-size: 1.4rem !important;
	font-weight: bold;
	padding: 0 0 0 10px;
}
.left-area h2,
.headingLv2 {
	font-size: 2.8rem !important;
	font-weight: bold;
	line-height: 1.5;
}
.left-area h2 span,
.headingLv2 span {
	font-size: 1.4rem !important;
	font-weight: bold;
	padding: 0 0 0 10px;
}
.left-area h2.ttlWrap {
	font-size: 2.8rem !important;
	font-weight: bold;
	line-height: 1.5;
	background-color: #1a1a1a;
	color: #fff;
	padding: 12px 18px;
}
.left-area h2.ttlWrap span {
	color: #fff;
}
.left-area h3,
.headingLv3 {
	font-size: 2.4rem !important;
	font-weight: bold !important;
	line-height: 1.45 !important;
}
.left-area h3 span,
.headingLv3 span {
	font-size: 1.2rem !important;
	font-weight: bold !important;
}


/* sns btn
----------------------- */
.sns-icon{
	font-size: 0;
	text-align: right;
	margin: 0 30px 0 0;
}
.sns-icon li{
	display: inline-block;
	margin: 0 0 0 2px;
}

.sns-link-bar {
	margin: 10px 0 0;
}
.sns-link-bar li{
	display: inline-block;
	margin: 0 0 0 0;
}
.sns-link-bar li#twitter{
	margin-right: 20px;
}
.sns-link-bar li#lineshare ,
.sns-link-bar li#lineshare img{
	vertical-align: top;
}
@media screen and (max-width: 767px) {
	.sns-link-bar{
		text-align: right;
	}
	.sns-link-bar li{
		margin: 5px;
	}
	.sns-link-bar li#lineshare ,
	.sns-link-bar li#lineshare img {
		vertical-align: top;
		height: 20px;
		width: auto;
	}

	.sns-icon{
			display: none;
		}
}

/* thumb-tab
----------------------- */
#news .thumb-tab {
	width: 880px;
	margin: 0 auto 20px;
	font-size: 0;
}
#news .thumb-tab li:hover,
#news .thumb-tab li.select{
	background-color: #00efe4;
}
#news .thumb-tab li:hover {
	opacity: 0.7;
}
#news .thumb-tab li a {
	color: #fff;
	display: block;
	padding: 5px 12px;
	font-weight: bold;
}


/* thumbs-col
----------------------- */
.thumbs-col{
	padding: 28px 10px 10px 10px;
}
.thumbs-col div:first-child{
	padding-right: 30px;
}
.thumbs-col div{
	display: table-cell;
	vertical-align: top;
}
@media screen and (max-width: 767px) {
	.thumbs-col>div:first-child{
		display: block;
		padding-right: 0px;
		text-align: center;
	}
.thumbs-col>div:first-child img{
		width: 50%;
	}
}
.mw-00{
	max-width: none;
}

@media screen and (min-width: 768px) {
	#news .thumb-tab li{
		background-color: #000;
		font-size: 1.4rem;
		text-align: center;
		display: inline-block;
		margin: 0 5px 0 0;
	}
	#news .thumb-tab li:last-child{
		margin: 0;
	}
	#news .thumb-tab li:hover,
	#news .thumb-tab li.select{
		background-color: #00efe4;
	}
	#news .thumb-tab li:hover {
		opacity: 0.7;
	}

	.thumbnail {
		overflow: hidden;
		clear: both;
	}
	.thumbnail .entry {
		width: 415px;
		margin: 0 30px 20px 0;
		font-size: 1.2rem;
		text-align: left;
		float: left;
		position: relative;
	}

	.thumbnail .entry:nth-of-type(2n+1){
		clear: both;
	}
}

@media screen and (max-width: 767px) {
	#news .thumb-tab {
		width: 100%;
		overflow: hidden;
		clear: both;
	}
	#news .thumb-tab li{
		background-color: #666666;
		width: 33%;
		height: 50px;
		float: left;
		font-size: 1.2rem;
		text-align: center;
		margin: 0 1px 1px 0;
		display: table;
	}
	#news .thumb-tab li a {
		color: #fff;
		padding: 0 5%;
		display: table-cell;
		vertical-align: middle;
	}
	@media screen and (max-width: 350px) {
		#news .thumb-tab li{
			width: 32.5%;
		}
	}
}


/* .list-col */
	#contents-area .list-col a:hover img{
		opacity: 0.7;
	}
	#contents-area .list-col a {
		display: block;
		color: #1a1a1a;
		text-decoration: none !important;
	}
	#contents-area .list-col a:hover {
		color: #00efe4;
	}


@media screen and (min-width: 768px) {

/* thumbnail-list
----------------------- */
	.thumbnail .thumb-date {
		padding: 12px 0 0;
	}
	.thumbnail .thumb-title {
		font-weight: bold;
		padding: 8px 0 10px;
	}
	.thumbnail .thumb-text {
		line-height: 1.57;
	}
	.thumbnail .thumb-text span{
		font-weight: normal;
	}
	#contents-area .thumbnail a,
	#contents-area .thumbnail a:hover .thumb-date,
	#contents-area .thumbnail a:hover .thumb-text {
		color: #000;
	}
	#contents-area .thumbnail a:hover .thumb-title{
		color: #00efe4;
	}
	.thumbnail-list {
		width: 870px;
		margin: 15px 0 0;
	}
	.thumbnail-list li {
		width: 435px;
		margin: 0 0 50px;
		float: left;
		overflow: hidden;
	}
	.thumbnail-list li:nth-child(odd) {
		clear: both;
	}
	#contents-area .thumbnail-list li a{
		color: #000;
	}
	#contents-area .thumbnail-list li a:hover {
		color: #00efe4;
	}

	#contents-area .thumbnail-list li a:hover h3{
		color: #00efe4;
	}

	.thumbnail-list li img{
		float: left;
	}
	.thumbnail-list li div{
		width: 280px;
		margin: 0 0 0 135px;
	}
	.thumbnail-list h3 {
		font-size: 1.2rem;
		font-weight: bold;
		line-height: 1.42;
	}
	.thumbnail-list li .date {
		font-size: 1.1rem;
		line-height: 1;
		padding: 0 0 3px;
	}
	.btn-veiw {
		clear: both;
		width: 300px;
		margin: 12px auto 0;
	}
	.btn-veiw:hover {
		opacity: 0.7;
	}
	#contents-area .btn-veiw a{
		background-color: #1a1a1a;
		line-height: 1;
		font-size: 1.4rem;
		text-align: center;
		padding: 9px 0;
		display: block;
	}
	.btn-veiw span{
		/*padding: 0 0 0 10px;*/
		padding: 0;
	}
	#contents-area .btn-veiw a,
	#contents-area .btn-veiw a:hover {
		color: #fff;
	}

/* text list03 */
	.text-list03-img{
		width:200px; float:left;
	}
	.text-list03-txt{
		width:650px; float:right;
	}
	.text-list03-txt li{
		padding-bottom: 15px;
	}
	.text-list03-txt li:not(:last-child){
		border-bottom: 1px solid #ccc;
	}
}

/* text-list02
----------------------- */
.text-list02{
	position: relative;
}
.text-list02 li{
	display: table;
	width: 100%;
	border-bottom: 1px solid #ccc;
}
.text-list02 p{
	line-height: 1.43;
}
.text-list02 li:first-child{
	border-top: 1px solid #ccc;
}
#contents-area .text-list02 a{
	color: #1a1a1a;
}
#contents-area .text-list02 a:hover{
	color: #00efe4;
	text-decoration: none;
}
#contents-area .text-list02 a:hover img{
	opacity: 0.8;
}
.text-list02 li .list-body{
	display: table-cell;
	vertical-align: middle;
	width: 100%;
	height: 80px;
	padding: 17px 39px;
}
.text-list02 li:nth-child(even){
	background-color: #f8f8f8;
}
.text-list02 .text-list-col{
	display: table;
	width: 100%;
}
.text-list02 .text-list-col>span,
.text-list02 .text-list-col>.text-list-control{
	display: table-cell;
	vertical-align: top;
}
.text-list02 select.text-list-control{
	position: relative;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: url("/assets/img/common/text_list_dd.png") no-repeat right 20px center / 9px 6px;
}
.text-list02 select.text-list-control:before{
	display: block;
	position: absolute;
	right: 0;
	top: 10px;
	width: 9px;
	height: 6px;
	content: "";
}
.text-list02 span{
	width: 192px;
	padding-top: 12px;
}
.text-list02.arrow li{
	padding: 16px 20px 15px 40px;
}
#contents-area .text-list02.arrow a{
	position: relative;
	color: #6633ff;
	line-height: 1.5;
}
#contents-area .text-list02.arrow a:before{
	display: block;
	position: absolute;
	width: 0;
	height: 0;
	left: -18px;
	top: 4px;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 6px solid #1a1a1a;
	content: "";
}
.text-list02 li:nth-child(odd) {
	background-color: #f8f8f8;
}
.text-list02 li:nth-child(even) {
	background-color: #ffffff;
}
.text-list02 select.text-list-control {
	background-color: #ffffff;
}
.text-list02 li .list-body{
	padding: 3% 0;
}
.text-list02 li{
	width: 104%;
	margin-left: -2%;
	margin-right: -2%;
	padding-left: 2%;
	padding-right: 2%;
}
.img-block{
	display: table;
	width: 100%
}
.img-block>div{
	display: table-cell;
	vertical-align: top;
}
.img-block>div:first-child{
	width: 120px;
}
.img-block>div:nth-child(2){
	padding-left: 15px;
}

.img-block>div:nth-child(2) p:first-child{
	position: relative;
	top: -4px;
	margin-bottom: -3px;
}

/* slider
----------------------- */
.slider-container{
	position: relative;
	padding: 22px 0 0;
	background-color: #f8f8f8;
	overflow: hidden;
}
.slider-col-4{
	width: 780px;
	margin: 0 auto;
}
.slider-col-4 li{
	width: 181px;
	margin: 0 9px;
}
#contents-area .slider-col-4 a{
	color: #1a1a1a;
}
#contents-area .slider-col-4 a:hover{
	color: #00efe4;
	text-decoration: none;
}
#contents-area .slider-col-4 a:hover img{
	opacity: 0.8;
}
.slider-col-4 p{
	margin-bottom: 8px;
}
.col-sp-thumbs .slick-next,
.col-sp-thumbs .slick-prev,
.slider-col-4 .slick-next,
.slider-col-4 .slick-prev{
	cursor: pointer;
	background-image: none;
	margin: 0;
	width: 25px;
	height: 26px;
	border: none;
	border-top: 4px solid #999;
	border-right: 4px solid #999;
}
.col-sp-thumbs .slick-next:hover,
.col-sp-thumbs .slick-prev:hover,
.slider-col-4 .slick-next:hover,
.slider-col-4 .slick-prev:hover{
	border-color: #1a1a1a;
}
.col-sp-thumbs .slick-next,
.slider-col-4 .slick-next{
	right: -30px;
	transform: translateY(-90%) rotate(45deg);
	-moz-transform: translateY(-90%) rotate(45deg);
	-webkit-transform: translateY(-90%) rotate(45deg);
}
.col-sp-thumbs .slick-prev,
.slider-col-4 .slick-prev{
	left: -30px;
	transform: translateY(-93%) rotate(225deg);
	-moz-transform: translateY(-93%) rotate(225deg);
	-webkit-transform: translateY(-93%) rotate(225deg);
}
.category-template .col-sp-thumbs .slick-next,
.category-template .slider-col-4 .slick-next,
.category-template .col-sp-thumbs .slick-prev,
.category-template .slider-col-4 .slick-prev{
	position: absolute;
	top: 36%;
	z-index: 99999999;
	background: transparent;
	font-size: 0;
}
.category-template .col-sp-thumbs .slick-next,
.category-template .slider-col-4 .slick-next {

	right: -30px;
	left: auto;
	transform: translateY(-50%) rotate(45deg);
	-moz-transform: translateY(-50%) rotate(45deg);
	-webkit-transform: translateY(-50%) rotate(45deg);
	border-left: none;
	border-bottom: none;
}
@media screen and (max-width: 767px){
	.list-col.col2>li:nth-child(odd),
	.list-col.col3>li:not(:nth-child(3n+3)),
	.list-col>li{
		width: 100%;
		margin: 0 auto 20px;
	}
	.list-col>li{
		width: 48%!important;
	}
	.list-col.col4>li{
		width: 104%!important;
		margin: 0 -2%!important;
		padding: 4% 2% 0;
		border-bottom: 1px solid #ccc;
	}
	.list-col.col4>li:first-child{
		border-top: 1px solid #ccc;
	}
	.list-col.col4>li:nth-child(even){
		background-color: #f8f8f8;
	}
	.text-list02 li .list-body{
		padding: 3% 0;
	}
	.text-list02 .text-list-col>span,
	.text-list02 .text-list-col>.text-list-control{
		display: block;
	}
	textarea.text-list-control{
		min-width: 100%;
	}
	.text-list02 span{
		padding: 0 0 2%;
	}
	.text-list02 .img-block{
		margin: 0;
	}
	.slider-container{
		margin-left: -2%;
		margin-right: -2%;
		width: 104%;
	}
	.slider-col-4{
		width: 85%;
		margin: 0 auto;
	}
	.col-sp-thumbs .slick-prev,
	.col-sp-thumbs .slick-next,
	.slider-col-4 .slick-prev,
	.slider-col-4 .slick-next{
		top: 26%;
		height: 14px;
		width: 12px;
		border-width: 2px;
	}
	.col-sp-thumbs .slick-prev,
	.slider-col-4 .slick-prev{
		left: -10px;
	}
	.col-sp-thumbs .slick-next,
	.slider-col-4 .slick-next{
		right: -10px;
	}
	.thumbs-col>div:first-child{
		display: block;
		padding-right: 0px;
		text-align: justify;
/*		text-align: center;
*/	}
	.thumbs-col>div:first-child img{
		width: 50%;
	}
	.thumbs-col>div:nth-child(2){
		padding: 20px 0 0 0;
	}
	.col-sp-thumbs-container{
		overflow: hidden;
	}
	.col-sp-thumbs{
		width: 90%;
		margin: 10px auto;
	}
	.col-sp-thumbs li{
		padding: 0 10px;
	}
	.col-sp-thumbs a>p:nth-child(4){
		display: none;
	}
	.col-sp-thumbs a.img-block>div:first-child,
	.col-sp-thumbs a.img-block>div:last-child,
	.col-sp-thumbs a.img-block{
		display: block;
		width: 100%;
		padding: 0;
	}
	.col-sp-thumbs a.img-block>div:nth-child(2) p:first-child{
		top: 0;
		margin: 3px 0 -2px 0
	}
}

@media screen and (min-width: 768px) {
.btn-usavich a:hover {
	opacity: 0.7;
}


	/* RIGHT-AREA
	-------------- */
	#recommend {
		margin: 30px 0;
	}
	.bnr-area {
		clear: both;
		margin: 0;
	}

	#contents-area .right-area	h3 span{
		padding-left: 15px;
	}
	.right-area .focus-list .title{
		word-wrap: break-word;
		font-size: 1.2rem;
		font-weight: bold;
		line-height: 1em;
	}
	.right-area .focus-list .text{
		word-wrap: break-word;
		font-size: 1.1rem;
	}
}
/* ==========================================================
	common.css
	display: SP
========================================================== */

@media screen and (max-width: 767px) {
	#contents-area #videocheck-detail .sns-icon{
		display: block;
	}
	.left-area h1,
	.headingLv1 {
		margin: 0;
		font-size: 1.7rem !important;
		font-weight: bold;
		line-height: 1.3;
		border-bottom: 4px solid #1a1a1a;
	}
	.left-area h1 span,
	.headingLv1 span {
		font-size: 1.2rem !important;
		font-weight: bold;
		padding: 0 0 0 10px;
	}
	
	#news h1 {
		font-size: 1.7rem !important;
		font-weight: bold;
		border-bottom: 2px solid #000;
		padding: 0 2% 8px;
		margin: 20px 0 0;
		width: 100%;
	}
	#news h1 span{
		font-size: 1.4rem;
		font-weight: bold;
		padding: 0 0 0 10px;
	}
/* アコーディオンボタン	*/
	 .thumbnail {
		padding: 30px 2% 10px;
		overflow: hidden;
		clear: both;
	}
	.thumbnail div {
		font-size: 1.2rem;
		text-align: left;
		float: left;
		margin: 0 0 20px;
	}
	.thumbnail .thumb-date {
		padding: 12px 0 0;
	}
	.thumbnail .thumb-title {
		font-weight: bold;
		padding: 8px 0 10px;
	}
	.thumbnail .thumb-text {
		line-height: 1.57;
	}
	.thumbnail .thumb-text span{
		font-weight: normal;
	}
	#contents-area .thumbnail a,
	#contents-area .thumbnail a:hover .thumb-date,
	#contents-area .thumbnail a:hover .thumb-text {
		color: #000;
	}
	#contents-area .thumbnail a:hover .thumb-title{
		color: #00efe4;
	}
	.thumbnail-list {
		padding: 0 2%;
		margin: 10px 0 0;
		font-size: 1.4rem;
	}
	.thumbnail-list li {
		margin: 0 0 25px;
		float: none;
		overflow: hidden;
	}
	#contents-area .thumbnail-list li a,
	#contents-area .thumbnail-list li a:hover {
		color: #000;
	}
	#contents-area .thumbnail-list li a:hover h3{
		color: #00efe4;
	}
	.thumbnail-list li{
	}
	.thumbnail-list li img{
		float: left;
		width: 25%;
		height: auto;
	}
	.thumbnail-list li div p{
		font-size: 1.1rem;
		font-weight: bold;
		line-height: 1.42;
		margin: 0 0 0 28%;
	}
	.thumbnail-list li .date {
		font-size: 1.1rem;
		font-weight: normal;
		line-height: 1;
		padding: 0 0 3px;
	}
	.btn-veiw {
		clear: both;
		width: 50%;
		margin: 12px auto 40px;
	}
	.btn-veiw:hover {
		opacity: 0.7;
	}
	#contents-area .btn-veiw a{
		background-color: #1a1a1a;
		line-height: 1;
		font-size: 1.4rem;
		text-align: center;
		padding: 8px 0;
		display: block;
	}
	.btn-veiw span{
		/*padding: 0 0 0 10px;*/
		padding: 0;
	}
	#contents-area .btn-veiw a,
	#contents-area .btn-veiw a:hover {
		color: #fff;
	}

/* news livewire */
#news .livewireH2 h2{
	width: 104%;
	margin: 0 -2%;
	font-size: 1.5rem !important;
}
#contents-area .h3-mtv-btn a{
	position: static;
	float: right;
	display: inline-block;
	margin-top: 10px;
	padding: 7px;
	background-color: #d9d9d9;
	color: #1a1a1a !important;
	font-size: 100% !important;
	font-weight: bold;
}
#contents-area .h3-mtv-btn a:hover{
	text-decoration: none;
}
/* text-list03 */
.text-list03-img{
	padding: 0 60px 15px 60px;
}
.text-list03-txt li{
	padding-bottom: 15px;
}
.text-list03-txt li:not(:last-child){
	border-bottom: 1px solid #ccc;
}

	.btn-usavich a:hover {
		opacity: 0.7;
	}

	/* RIGHT-AREA
	-------------- */
	.movie-page {
		padding: 0 2%;
	}
	#recommend {
		margin: 30px 0;
	}
	#focus .focus-list {
		margin: 0 0 20px;
	}
	#focus .focus-list li a:hover{
		color: #00efe4;
	}
	
	#inner-area div.thumbs-col div.photo {
		margin: 0 auto !important;
		float: none !important;
		text-align: center !important;
		width: 100% !important;
		padding: 0 0 10px 0 !important;
		display: block !important;
	}
	#inner-area div.thumbs-col div.photo img{
		width: 95% !important;
	}

	#mtvNewsContent img.newsPhotoSub {
		width: 95% !important;
	}
}

/* NEWS hacks / fix to support old design */
/* This is dependant upon #mtvNewsContent fS14, so need to adjust when that's changed */
#mtvNewsContent strong {
	font-weight: bold !important;
	font-size: 1.4rem !important;
}

.sns {
    text-align: right;
    margin-top: 20px;
}

.sns #facebook {
    bottom: 5px;
}

.sns .line-it-icon img{
        vertical-align: top;
}

/* suffered by transcosmos, I had to code this */
@media screen and (max-width: 767px) {
.sns .line-it-icon img{
        height: 20px;
        width: 82px;
}
}
