@charset "UTF-8";
/* CSS Document */

*{
	user-select: none; /* CSS3 */
	-moz-user-select: none; /* Firefox */
	-webkit-user-select: none; /* Safari,Chrome, etc */
	-ms-user-select: none; /* IE10over */
}

input,textarea{
	user-select: auto !important; /* CSS3 */
	-moz-user-select: auto !important; /* Firefox */
	-webkit-user-select: auto !important; /* Safari,Chrome, etc */
	-ms-user-select: auto !important; /* IE10over */
}

/* ===================================
	base CSS
	=================================== */

/* ===================================

	reset Area

	=================================== */


body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td{
	padding:0;
	margin:0;
	font-family: "メイリオ", Meiryo,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

}
table{
	border-collapse: collapse;
	border-spacing:0;
}
fieldset,img{
	border:0;
}
address,caption,cite,code,dfn,em,strong,th,var{
	font-weight:normal;
	font-style:normal;
}
ol,ul{
	list-style:none;
}
caption,th{
	text-align:left;
}
h1,h2,h3,h4,h5,h6{
	font-weight:normal;
	font-size:100%;
}
q:before,q:after{
	content:'';
}
abbr,acronym{
	border:0;
}

img{
	border:none;
	padding:0;
	margin:0;
}

body{
}


/* ===================================

	main-content

	=================================== */



#container{
	min-width:300px;
}

#video-area{
text-align:center;
}
#video-area video{
width:100%;
height:auto;
}

#jacket{
width:100%;
height:auto;
}

@media all and (orientation:portrait){
	#video-area{
		margin-top:25px;
	}
}

/* iphone4 4S ipod touch 4under landscape */
@media (min-width: 320px) and (max-width: 321px) and (orientation:portrait){
	#video-area{
	margin-top:0;
	}
	#video-area video{
		width:320px;
		height:180px;
	}
}

/* iphone4 4S ipod touch 4under landscape */
@media (min-width: 480px) and (max-width: 481px) and (orientation:landscape){
	#video-area{
	margin-top:0;
	}
	#video-area video{
		width:480px;
		height:270px;
	}
}
/* iphone4 4S ipod touch 4under landscape */
@media (min-width: 576px) and (max-width: 577px) and (orientation:landscape){
	#video-area{
	margin-top:0;
	}
	#video-area video{
		width:576px;
		height:324px;
	}
}

/* ipad ipad2 ipadmini portrait */
@media (min-width: 768px) and (max-width: 769px) and (orientation:portrait){
	#video-area video{
		width:768px;
		height:432px;
	}
}

/* ipad ipad2 ipadmini landscape */
@media (min-width: 1024px) and (max-width: 1025px) and (orientation:landscape){
	#video-area{
	margin-top:0;
	}
	#video-area video{
		width:1024px;
		height:576px;
	}
}



#video-bottom p{
	min-width:300px;
	max-width:640px;
	margin:15px auto 0;
	font-size:14px;
	line-height:1.2;
}

#links-btn{
	margin:20px auto;
	padding:0;
}
#links-btn p{
line-height:1.5;
font-size:16px;
	width:90%;
	max-width:320px;
	color:#ccc;
	display:block;
	text-align:center;
	margin:0 auto 10px;
	padding:5px 0;
	text-decoration:none;
	border-radius:5px;
	border:double 3px #ccc;
	background: #eee;
	min-width:0;
}
#links-btn a{
	width:90%;
	max-width:320px;
	color:#333;
	display:block;
	text-align:center;
	margin:0 auto 10px;
	padding:5px 0;
	text-decoration:none;
	border-radius:5px;
	border:double 3px #333;
	background: #fafafa;
}

#links-btn a:hover{
	color:#fff;
	border:double 3px #fff;
	background: #333;

}



#links-btn .prev_btn{
	float:left;
	width:50%;
}
#links-btn .next_btn{
	float:right;
	width:50%;
}
#links-btn .detail-back{
	padding-top:20px;
	clear:both;
}


/* ===================================

	Other Detail Area

	=================================== */



.clearfix:after {
display: block;
clear: both;
height: 0;
visibility: hidden;
content: ".";
line-height: 0;
}
.clearfix {
display: inline-table;
min-height: 1%;
}
/* for macIE \*/
* html .clearfix {
height: 1%;
}
.clearfix {
display: block;
}
/* end of for macIE */



.titleL {
	border-bottom:1px solid #dcdcdc;
	margin:0 10px;
	margin-bottom:20px;
	margin-top: 20px;
	border-left: 15px solid #d70545;
	display: block;
	padding-top:5px;
	padding-bottom:5px;
	padding-left: 5px;
	font-size:22px;
}
.jacket .titleL,
.scene .titleL{
	border-left: 15px solid #026108;
	line-height:1.2em;
}
.samplemv #video-bottom p{
font-size:16px;
margin-bottom:40px;
}

.samplemv .titleL{
	border-left: 15px solid #026108;
}

.scene_num{
	text-align:center;
	margin:10px 0;
}

.titleS {
	font-size: 18px;
	margin: 0 10px 20px;
}

.titleS p{
	border-left: #d70545 solid 10px;
	display: block;
	padding:3px 3px 3px 10px;
}
.scene_num span{
	margin:0 0.5em;
}
.scene_num .num_ch{
}
.scene_num .num_par{
}