a:link {
	color: #e5007f;
}
a:visited {
	color: #e5007f;
}
a:active {
	color: #e5007f;
}
a:hover {
	color: #000;
}

.kuro {
	background-color: #000;
	width: 100%;
}

.red {
	color: #ff0000;
}

@media only screen and (min-width: 1281px) {
body {
	font-weight: 300;
	padding: 0px;
	margin: 0px;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	background-color: #fff100;
}

header {
	width: 100%;
	max-width: 2000px;
	color: #e5007f;
	text-align: center;
	background-color: rgba(255,255,255,0.1);
	height: 50px;
	float: left;
	background-color: #fff100;
	position: fixed;
	z-index: 10;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
}
.cen1 {
	min-height: 100%;
	width: auto;
	max-width: 2000px;
	padding: 0px;
	margin-top: 0px;
	margin-right: auto;
	margin-left: auto;

}
h1 {
display:inline;
}
#nav {
	padding: 10px;
	width: 30px;
	background-color: #900;
  display:none;
}

#nav-drawer {
  position: relative;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 25px;/*長さ*/
  border-radius: 3px;
  background: #fff;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;/*最前面に*/
	width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
	max-width: 330px;/*最大幅（調整してください）*/
	height: 100%;
	background: #900;/*背景色*/
	transition: .3s ease-in-out;/*滑らかに表示*/
	-webkit-transform: translateX(-105%);
	transform: translateX(-105%);/*左に隠しておく*/
	color: #e5007f;
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
	-webkit-transform: translateX(0%);
	transform: translateX(0%);/*中身を表示（右へスライド）*/
	box-shadow: 6px 0 25px rgba(255,255,255,0.15);
	-webkit-box-shadow: 6px 0 25px rgba(255,255,255,0.15);
}

 
.he1 {
	width: 10%;
	float: left;
	padding-left: 1%;
	padding-top: 7px;
}
.he2 {
	width: 77%;
	float: left;
	text-align: center;
}
.he3 {
	width: 12%;
	float: left;
	margin-top: px;
	padding-top: 10px;
}
.cen {
	width: 100%;
	max-width: 2000px;
	text-align: center;
	padding: 0px;
	float: left;
	margin-top: 34px;
	margin-bottom: 0px;
	margin-right: auto;
	margin-left: auto;
	left: 0px;
	top: 0px;
	bottom: 0px;
	right: 0px;

}
.main1 {
	width: 100%;
	max-width: 2000px;





  padding-top: calc(2710 / 1920 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
	background: url(img/main_d4.jpg) center center / cover no-repeat;
	margin-top: px;
	height: auto;
	float: left;
}
.main2 {
	width: 100%;



  padding-top: calc(2710 / 1920 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
	background: url(img/main_d4.jpg) center center / cover no-repeat;
	float: left;
	margin-top: px;
	height: auto;
  display:none;
}
.tw {
	width: 310px;
	float: left;
	left: 78%;
	top: 80%;
	right: 0px;
	text-align: right;
	position: absolute;
}
.cre {
	width: 48%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
img {  
     max-width: 100%;  
     height: auto;  
}
.sound {
	float: left;
}

.sound a {
	display: block;
	width: 36px;
	height: 33px;
	background: #EFEFEE url(img/common/btn_sound2.png) no-repeat 15px center;
}

.sound .pause {
	display: none;
	background: #EFEFEE url(img/common/btn_sound.png) no-repeat 15px center;
}
.pa10 {
	padding-top: 10px;
}
#int {
	width: 100%;
	max-width: 2000px;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.pa50 {
	padding-bottom: 100px;
}
.bbb {
	font-size: 72px;
	padding-bottom: 30px;
	font-weight: bold;
	color: #e5007f;
}
.int_t {
	background-size: cover;
	float: left;
	background-image: url(img/intro_b.jpg);
	background-position: top right;
	background-repeat: no-repeat;
	max-width: 2000px;
}
.int_text {
	width: 44%;
	font-size: x-large;
	text-align: left;
	line-height: 40px;
	letter-spacing: 1px;
	padding-left: 6%;
	padding-right: 40%;
	padding-top: 80px;
	padding-bottom: 80px;
	font-weight: 600;
	height: auto;
	float: left;
	color: #000;
}
.story_t {
	width: 100%;
	max-width: 2000px;
	background: url(img/story_b.jpg) top center / cover no-repeat;
	float: left;
}
.story_text {
	width: 51%;
	font-size: x-large;
	text-align: left;
	line-height: 40px;
	letter-spacing: 1px;
	padding-left: 43%;
	padding-right: 6%;
	padding-top: 80px;
	padding-bottom: 80px;
	font-weight: 600;
	height: auto;
	float: left;
	color: #FFFFFF;
	max-width: 2000px;
}
#s {
	width: 100%;
	float: left;
	height: 200px;
	background-color: #0066CC;
}

#is_sli {
	width: 100%;
	float: left;
}
#footer {
	float: left;
	width: 100%;
	max-width: px;
	top: 0px;
	left: 0px;

	padding-top: 1%;
	padding-bottom: 1%;
	text-align: center;
	font-size: 14px;
	color: #FFF;
	letter-spacing: 1px;
	background-color: #000;
}
#cast {
	width: 100%;
	max-width: 2000px;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.cast_t {
	width: 100%;
	float: left;
	max-width: 2000px;
	background-color: #000;
}
#videoarea {
	display:block;
    width:100%;
    height:0x;
    margin:10px auto;
}
#playlist {
    display:table;
    list-style-type: none;
}
#playlist li{
    cursor:pointer;
    padding:12px 8px;
    border:1px solid silver;
    margin:5px 250px;
}

#playlist li:hover{
    background-color: #0CC;
	border: 1px solid silver;
	color: #FFF;                        
}
#videoarea2 {
	display:block;
    width:100%;
    height:0x;
    margin:10px auto;
}
#playlist2 {
    display:table;
    list-style-type: none;
}
#playlist2 li{
    cursor:pointer;
    padding:12px 8px;
    border:1px solid silver;
    margin:5px 250px;
}

#playlist2 li:hover{
    background-color: #0CC;
	border: 1px solid silver;
	color: #FFF;                        
}
.tw_sp {
	width: 100%;
	height: 450px;
  display:none;
}
.sp1 {
	width: 40%;
	float: left;
	margin-left: 10%;
}
.sp2 {
	width: 45%;
	float: left;
	text-align: left;
	margin-left: 5%;
}
.sp3 {
	width: 94%;
	float: left;
	margin-left: 3%;
	margin-right: 3%;
	display:none;
}
.cre1 {

}
.cre2 {
	display:none;
}
.cre3 {
	display:none;
}
.int1 {

}
.int2 {
	display:none;
}
.par20{
	padding-right: 15px;
	padding-left: 15px;
}
.r15{
	padding-right: 15px;
}
.resizeimage img { width: 16.6%; }
.fl {
	float: left;
}
#staff {
	width: 100%;
	max-width: 2000px;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.staff_t {
	width: 100%;
	max-width: 2000px;
	float: left;
	background-color: #000;
}
.cast_d {

}
.cast_s {
	display:none;
}
.cast_o1 {

}
.cast_o2 {
	display:none;
}
.staff_d {

}
.staff_s {
	display:none;
}
.staff_o1 {

}
.staff_o2 {
	display:none;
}
#theater {
	width: 100%;
	max-width: 2000px;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
dl{
	width: 76%;
	float: left;
	margin-left: 12%;
	margin-right: 12%;
	color: #000;
	font-size: x-large;
	text-align: left;
	margin-top: 20px;
	}
dt {
float: left ;
width: 150px;
	color: #000;
	font-size: x-large;
	margin-left: 0px;
}

dd {
float: left ;
	color: #000;
	font-size: x-large;
width: 400px;
	margin-left: 0px;
}
.mt1{
	width: 76%;
	float: left;
	margin-left: 12%;
	margin-right: 12%;
	color: #000;
	font-size: x-large;
	text-align: left;
	margin-top: 20px;
	max-width: 2000px;
	}
.mt2 {
	float: left;
	width: 18%;
	color: #000;
	font-size: x-large;
	margin-left: 0px;
}

.mt3 {
	float: left;
	color: #000;
	font-size: x-large;
	width: 41%;
	margin-left: 0px;
}

.mt4 {
	float: left;
	color: #000;
	font-size: x-large;
	width: 41%;
	margin-left: 0px;
}
.chihou1{
	width: 80%;
	text-align: left;
	float: left;
	margin-left: 10%;
	margin-right: 10%;
	color: #e5007f;
	font-size: xx-large;
	margin-top: 30px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 2px solid #e5007f;
	font-weight: bold;
	}
.chihou2{
	width: 80%;
	text-align: left;
	float: left;
	margin-left: 10%;
	margin-right: 10%;
	color: #e5007f;
	font-size: xx-large;
	margin-top: 70px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 2px solid #e5007f;
	font-weight: bold;
	}
#comment {
	width: 100%;
	max-width: 2000px;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: 50px;
	background-color: #e5007f;
	float: left;
}
.comment_t{
	width: 80%;
	text-align: left;
	float: left;
	margin-left: 10%;
	margin-right: 10%;
	color: #000;
	font-size: x-large;
	margin-top: 30px;
	padding-top: 5px;
	padding-bottom: 30px;
	border-bottom: 1px dotted #000;
	font-weight: normal;
	line-height: 30px;
	letter-spacing: 1px;
	margin-bottom: px;
	}
.comment_name{
	width: 100%;
	text-align: left;
	float: left;
	color: #000;
	font-size: x-large;
	margin-top: 30px;
	font-weight: normal;
	letter-spacing: 1px;
	}
#original {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.ori50 {
	width: 80%;
	margin-left: 10%;
	margin-right: 10%;
	padding-top: 50px;
	float: left;
	padding-bottom: 50px;
}
*{
    margin: 0;
    padding: 0;

}



}

@media all and (min-width: 1025px) and (max-width: 1280px) {
body {
	font-weight: 300;
	padding: 0px;
	margin: 0px;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	background-color: #fff100;
}

header {
	width: 100%;
	color: #e5007f;
	text-align: left;
	background-color: rgba(255,255,255,0.1);
	height: 50px;
	float: left;
	background-color: #fff100;
	position: fixed;
	z-index: 10;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
}
#nav {
	margin-left: 10px;
	margin-top: 3px;
	padding: 10px;
	width: 25px;
	background-color: #fff100;
}

#nav-drawer {
  position: relative;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 25px;/*長さ*/
  border-radius: 3px;
  background: #fff;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;/*最前面に*/
	width: 80%;/*右側に隙間を作る（閉じるカバーを表示）*/
	max-width: 330px;/*最大幅（調整してください）*/
	height: 100%;
	background: #fff100;/*背景色*/
	transition: .3s ease-in-out;/*滑らかに表示*/
	-webkit-transform: translateX(-105%);
	transform: translateX(-105%);/*左に隠しておく*/
	color: #e5007f;
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
	-webkit-transform: translateX(0%);
	transform: translateX(0%);/*中身を表示（右へスライド）*/
	box-shadow: 6px 0 25px rgba(255,255,255,0.15);
	-webkit-box-shadow: 6px 0 25px rgba(255,255,255,0.15);
}
#nav ul{
	float: left;
	padding: 0px;
	margin: 0px;
}
#nav li{
	padding-top: 10px;
	padding-left: 10px;
}
 
.he1 {
	width: 5%;
	float: right;
	padding-right: 1%;
	padding-top: 7px;
	text-align: right;
}
.he2 {
	width: 80%;
	float: left;
	text-align: center;
  display:none;
}
.he3 {
	width: 14%;
	float: left;
	margin-top: px;
  display:none;
}
.cen {
	width: 100%;
	text-align: center;
	padding: 0px;
	float: left;
	margin-top: 34px;
	margin-bottom: 0px;
	margin-right: auto;
	margin-left: auto;
	left: 0px;
	top: 0px;
	bottom: 0px;
	right: 0px;

}
.main1 {
	width: 100%;



  padding-top: calc(2710 / 1920 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
	background: url(img/main_d4.jpg) center center / cover no-repeat;
	float: left;
	margin-top: px;
	height: auto;
}
.main2 {
	width: 100%;



  padding-top: calc(2710 / 1920 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
	background: url(img/main_d4.jpg) center center / cover no-repeat;
	float: left;
	margin-top: px;
	height: auto;
  display:none;
}
.tw {
	width: 20%;
	float: left;
	left: 76%;
	top: 50%;
	right: 0px;
	text-align: right;
	position: absolute;
}
.cre {
	width: 48%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
img {  
     max-width: 100%;  
     height: auto;  
}
.sound {
	float: left;
}

.sound a {
	display: block;
	width: 36px;
	height: 33px;
	background: #EFEFEE url(img/common/btn_sound2.png) no-repeat 15px center;
}

.sound .pause {
	display: none;
	background: #EFEFEE url(img/common/btn_sound.png) no-repeat 15px center;
}
.pa10 {
	padding-top: 10px;
}
#int {
	width: 100%;
	text-align: center;
	padding-top: 1px;
	padding-bottom: 1px;
	color: #e5007f;
	margin-top: -2px;
	background-color: #e5007f;
}
.pa50 {
	padding-bottom: 100px;
}
.bbb {
	font-size: 72px;
	padding-bottom: 30px;
	font-weight: bold;
	color: #e5007f;
}
.int_t {
	background-size: cover;
	float: left;
	background-image: url(img/intro_b.jpg);
	background-position: top right;
	background-repeat: no-repeat;
}
.int_text {
	width: 86%;
	margin: 5%;

	font-size: medium;
	text-align: left;
	line-height: 32px;
	letter-spacing: 1px;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 2%;
	padding-bottom: 2%;
	font-weight: 600;
	height: auto;
	float: left;
	color: #333333;
	background-color: #FFFFFF;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}
.story_t {
	background-size: cover;
	float: left;
	background-image: url(img/story_b.jpg);
	background-position: top left;
	background-repeat: no-repeat;
}
.story_text {
	width: 86%;
	margin: 5%;

	font-size: medium;
	text-align: left;
	line-height: 32px;
	letter-spacing: 1px;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 2%;
	padding-bottom: 2%;
	font-weight: 600;
	height: auto;
	float: left;
	color: #fff;
	background-color: #000000;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}
#s {
	width: 100%;
	float: left;
	height: 200px;
	background-color: #0066CC;
}

#is_sli {
	width: 100%;
	float: left;
}

#footer {
	float: left;
	width: 100%;
	max-width: px;
	top: 0px;
	left: 0px;

	padding-top: 1%;
	padding-bottom: 1%;
	text-align: center;
	font-size: 14px;
	color: #FFF;
	letter-spacing: 1px;
	background-color: #343c3f;
}
#cast {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.cast_t {
	width: 100%;
	float: left;
	background-color: #000;
}
#videoarea {
	display:block;
    width:100%;
    height:0x;
    margin:10px auto;
}
#playlist {
    display:table;
    list-style-type: none;
}
#playlist li{
    cursor:pointer;
    padding:12px 8px;
    border:1px solid silver;
    margin:5px 250px;
}

#playlist li:hover{
    background-color: #0CC;
	border: 1px solid silver;
	color: #FFF;                        
}
#videoarea2 {
	display:block;
    width:100%;
    height:0x;
    margin:10px auto;
}
#playlist2 {
    display:table;
    list-style-type: none;
}
#playlist2 li{
    cursor:pointer;
    padding:12px 8px;
    border:1px solid silver;
    margin:5px 250px;
}

#playlist2 li:hover{
    background-color: #0CC;
	border: 1px solid silver;
	color: #FFF;                        
}
.tw_sp {
	width: 100%;
	height: 450px;
  display:none;
}
.sp1 {
	width: 40%;
	float: left;
	margin-left: 10%;
}
.sp2 {
	width: 45%;
	float: left;
	text-align: left;
	margin-left: 5%;
}
.sp3 {
	width: 94%;
	float: left;
	margin-left: 3%;
	margin-right: 3%;
	display:none;
}
.cre1 {

}
.cre2 {
	display:none;
}
.cre3 {
	display:none;
}
.int1 {

}
.int2 {
	display:none;
}
.par20{
	padding-right: 15px;
	padding-left: 15px;
}
.r15{
	padding-right: 15px;
}
.resizeimage img { width: 16.6%; }
.fl {
	float: left;
}
#staff {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.staff_t {
	width: 100%;
	float: left;
	background-color: #000;
}
.cast_d {

}
.cast_s {
	display:none;
}
.cast_o1 {

}
.cast_o2 {
	display:none;
}
.staff_d {

}
.staff_s {
	display:none;
}
.staff_o1 {

}
.staff_o2 {
	display:none;
}
#theater {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
dl{
	width: 76%;
	float: left;
	margin-left: 12%;
	margin-right: 12%;
	color: #000;
	font-size: x-large;
	text-align: left;
	margin-top: 20px;
	}
dt {
float: left ;
width: 150px;
	color: #000;
	font-size: x-large;
	margin-left: 0px;
}

dd {
	float: left;
	color: #000;
	font-size: x-large;
	width: 300px;
	margin-left: 0px;
}
.mt1{
	width: 76%;
	float: left;
	margin-left: 12%;
	margin-right: 12%;
	color: #000;
	font-size: x-large;
	text-align: left;
	margin-top: 20px;
	}
.mt2 {
	float: left;
	width: 18%;
	color: #000;
	font-size: x-large;
	margin-left: 0px;
}

.mt3 {
	float: left;
	color: #000;
	font-size: x-large;
	width: 41%;
	margin-left: 0px;
}

.mt4 {
	float: left;
	color: #000;
	font-size: x-large;
	width: 41%;
	margin-left: 0px;
}
.chihou1{
	width: 80%;
	text-align: left;
	float: left;
	margin-left: 10%;
	margin-right: 10%;
	color: #e5007f;
	font-size: xx-large;
	margin-top: 30px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 2px solid #e5007f;
	font-weight: bold;
	}
.chihou2{
	width: 80%;
	text-align: left;
	float: left;
	margin-left: 10%;
	margin-right: 10%;
	color: #e5007f;
	font-size: xx-large;
	margin-top: 70px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 2px solid #e5007f;
	font-weight: bold;
	}
#comment {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: 50px;
	background-color: #e5007f;
	float: left;
}
.comment_t{
	width: 80%;
	text-align: left;
	float: left;
	margin-left: 10%;
	margin-right: 10%;
	color: #000;
	font-size: x-large;
	margin-top: 30px;
	padding-top: 5px;
	padding-bottom: 30px;
	border-bottom: 1px dotted #000;
	font-weight: normal;
	line-height: 30px;
	letter-spacing: 1px;
	margin-bottom: px;
	}
.comment_name{
	width: 100%;
	text-align: left;
	float: left;
	color: #000;
	font-size: x-large;
	margin-top: 30px;
	font-weight: normal;
	letter-spacing: 1px;
	}
#original {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.ori50 {
	width: 80%;
	margin-left: 10%;
	margin-right: 10%;
	padding-top: 50px;
	float: left;
	padding-bottom: 50px;
}
*{
    margin: 0;
    padding: 0;

}



}
@media all and (min-width: 769px) and (max-width: 1024px) {
body {
	font-weight: 300;
	padding: 0px;
	margin: 0px;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	background-color: #fff100;
}

header {
	width: 100%;
	color: #e5007f;
	text-align: left;
	background-color: rgba(255,255,255,0.1);
	height: 50px;
	float: left;
	background-color: #fff100;
	position: fixed;
	z-index: 10;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
}
#nav {
	margin-left: 10px;
	margin-top: 3px;
	padding: 10px;
	width: 25px;
	background-color: #fff100;
}

#nav-drawer {
  position: relative;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 25px;/*長さ*/
  border-radius: 3px;
  background: #fff;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;/*最前面に*/
	width: 80%;/*右側に隙間を作る（閉じるカバーを表示）*/
	max-width: 330px;/*最大幅（調整してください）*/
	height: 100%;
	background: #fff100;/*背景色*/
	transition: .3s ease-in-out;/*滑らかに表示*/
	-webkit-transform: translateX(-105%);
	transform: translateX(-105%);/*左に隠しておく*/
	color: #e5007f;
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
	-webkit-transform: translateX(0%);
	transform: translateX(0%);/*中身を表示（右へスライド）*/
	box-shadow: 6px 0 25px rgba(255,255,255,0.15);
	-webkit-box-shadow: 6px 0 25px rgba(255,255,255,0.15);
}
#nav ul{
	float: left;
	padding: 0px;
	margin: 0px;
}
#nav li{
	padding-top: 10px;
	padding-left: 10px;
}
 
.he1 {
	width: 5%;
	float: right;
	padding-right: 1%;
	padding-top: 7px;
	text-align: right;
}
.he2 {
	width: 80%;
	float: left;
	text-align: center;
  display:none;
}
.he3 {
	width: 14%;
	float: left;
	margin-top: px;
  display:none;
}
.cen {
	width: 100%;
	text-align: center;
	padding: 0px;
	float: left;
	margin-top: 34px;
	margin-bottom: 0px;
	margin-right: auto;
	margin-left: auto;
	left: 0px;
	top: 0px;
	bottom: 0px;
	right: 0px;

}
.main1 {
	width: 100%;



  padding-top: calc(2710 / 1920 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
	background: url(img/main_d4.jpg) center center / cover no-repeat;
	float: left;
	margin-top: px;
	height: auto;
  display:none;
}
.main2 {
	width: 100%;



  padding-top: calc(2710 / 1920 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
	background: url(img/main_d4.jpg) center center / cover no-repeat;
	float: left;
	margin-top: px;
	height: auto;
}

.tw {
	width: 20%;
	float: left;
	left: 76%;
	top: 49%;
	right: 0px;
	text-align: right;
	position: absolute;
}
.cre {
	width: 100%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
img {  
     max-width: 100%;  
     height: auto;  
}
.sound {
	float: right;
}

.sound a {
	display: block;
	width: 36px;
	height: 33px;
	background: #EFEFEE url(img/common/btn_sound2.png) no-repeat 15px center;
}

.sound .pause {
	display: none;
	background: #EFEFEE url(img/common/btn_sound.png) no-repeat 15px center;
}
.pa10 {
	padding-top: 10px;
}
#int {
	width: 100%;
	text-align: center;
	padding-top: 1px;
	padding-bottom: 1px;
	color: #e5007f;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.pa50 {
	padding-bottom: 100px;
}
.bbb {
	font-size: 72px;
	padding-bottom: 30px;
	font-weight: bold;
	color: #e5007f;
}
.int_t {
	background-size: cover;
	float: left;
	background-image: url(img/intro_b.jpg);
	background-position: top right;
	background-repeat: no-repeat;
}
.int_text {
	width: 86%;
	margin: 5%;

	font-size: medium;
	text-align: left;
	line-height: 32px;
	letter-spacing: 1px;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 2%;
	padding-bottom: 2%;
	font-weight: 600;
	height: auto;
	float: left;
	color: #333333;
	background-color: #FFFFFF;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}
.story_t {
	background-size: cover;
	float: left;
	background-image: url(img/story_b.jpg);
	background-position: top left;
	background-repeat: no-repeat;
}
.story_text {
	width: 86%;
	margin: 5%;

	font-size: medium;
	text-align: left;
	line-height: 32px;
	letter-spacing: 1px;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 2%;
	padding-bottom: 2%;
	font-weight: 600;
	height: auto;
	float: left;
	color: #fff;
	background-color: #000000;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}
#s {
	width: 100%;
	float: left;
	height: 200px;
	background-color: #0066CC;
}

#is_sli {
	width: 100%;
	float: left;
}

#footer {
	float: left;
	width: 100%;
	max-width: px;
	top: 0px;
	left: 0px;

	padding-top: 1%;
	padding-bottom: 1%;
	text-align: center;
	font-size: 14px;
	color: #FFF;
	letter-spacing: 1px;
	background-color: #343c3f;
}
#cast {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.cast_t {
	width: 100%;
	float: left;
	background-color: #000;
}	
#videoarea {
	display:block;
    width:100%;
    height:0x;
    margin:10px auto;
}
#playlist {
    display:table;
    list-style-type: none;
}
#playlist li{
    cursor:pointer;
    padding:12px 8px;
    border:1px solid silver;
    margin:5px 250px;
}

#playlist li:hover{
    background-color: #0CC;
	border: 1px solid silver;
	color: #FFF;                        
}
#videoarea2 {
	display:block;
    width:100%;
    height:0x;
    margin:10px auto;
}
#playlist2 {
    display:table;
    list-style-type: none;
}
#playlist2 li{
    cursor:pointer;
    padding:12px 8px;
    border:1px solid silver;
    margin:5px 250px;
}

#playlist2 li:hover{
    background-color: #0CC;
	border: 1px solid silver;
	color: #FFF;                        
}
.tw_sp {
	width: 100%;
	height: auto;
	float: left;
}
.sp1 {
	width: 60%;
	float: left;
	margin-left: 3%;
}
.sp2 {
	width: 32%;
	float: left;
	text-align: right;
	margin-left: 2%;
	margin-right: 3%;
	padding-top: 10px;
}
.sp3 {
	width: 94%;
	float: left;
	margin-left: 3%;
	margin-right: 3%;
	display:none;
}
.pa5 {
	padding-top: 5px;
}
.kara {
	float: left;
}
.cre1 {
	display:none;
}
.cre2 {

}
.cre3 {
	display:none;
}
.int1 {

}
.int2 {
	display:none;
}
.par20{
	padding-right: 15px;
	padding-left: 15px;
}
.r15{
	padding-right: 15px;
}
.resizeimage img { width: 16.6%; }
.fl {
	float: left;
}
#staff {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.staff_t {
	width: 100%;
	float: left;
	background-color: #000;
}
.cast_d {

}
.cast_s {
	display:none;
}
.cast_o1 {

}
.cast_o2 {
	display:none;
}
.staff_d {

}
.staff_s {
	display:none;
}
.staff_o1 {

}
.staff_o2 {
	display:none;
}
#theater {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
dl{
	width: 76%;
	float: left;
	margin-left: 12%;
	margin-right: 12%;
	color: #000;
	font-size: x-large;
	text-align: left;
	margin-top: 20px;
	}
dt {
	float: left;
	width: 120px;
	color: #000;
	font-size: x-large;
	margin-left: 0px;
}

dd {
	float: left;
	color: #000;
	font-size: x-large;
	width: 260px;
	margin-left: 0px;
}
.mt1{
	width: 76%;
	float: left;
	margin-left: 12%;
	margin-right: 12%;
	color: #000;
	font-size: x-large;
	text-align: left;
	margin-top: 20px;
	}
.mt2 {
	float: left;
	width: 18%;
	color: #000;
	font-size: x-large;
	margin-left: 0px;
}

.mt3 {
	float: left;
	color: #000;
	font-size: x-large;
	width: 41%;
	margin-left: 0px;
}

.mt4 {
	float: left;
	color: #000;
	font-size: x-large;
	width: 41%;
	margin-left: 0px;
}
.chihou1{
	width: 80%;
	text-align: left;
	float: left;
	margin-left: 10%;
	margin-right: 10%;
	color: #e5007f;
	font-size: xx-large;
	margin-top: 30px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 2px solid #e5007f;
	font-weight: bold;
	}
.chihou2{
	width: 80%;
	text-align: left;
	float: left;
	margin-left: 10%;
	margin-right: 10%;
	color: #e5007f;
	font-size: xx-large;
	margin-top: 70px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 2px solid #e5007f;
	font-weight: bold;
	}
#comment {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: 50px;
	background-color: #e5007f;
	float: left;
}
.comment_t{
	width: 80%;
	text-align: left;
	float: left;
	margin-left: 10%;
	margin-right: 10%;
	color: #000;
	font-size: x-large;
	margin-top: 30px;
	padding-top: 5px;
	padding-bottom: 30px;
	border-bottom: 1px dotted #000;
	font-weight: normal;
	line-height: 30px;
	letter-spacing: 1px;
	margin-bottom: px;
	}
.comment_name{
	width: 100%;
	text-align: left;
	float: left;
	color: #000;
	font-size: x-large;
	margin-top: 30px;
	font-weight: normal;
	letter-spacing: 1px;
	}
#original {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.ori50 {
	width: 80%;
	margin-left: 10%;
	margin-right: 10%;
	padding-top: 50px;
	float: left;
	padding-bottom: 50px;
}
*{
    margin: 0;
    padding: 0;

}



}
@media all and (min-width: 481px) and (max-width: 768px) {
body {
	font-weight: 300;
	padding: 0px;
	margin: 0px;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	background-color: #fff100;
}

header {
	width: 100%;
	color: #e5007f;
	text-align: left;
	background-color: rgba(255,255,255,0.1);
	height: 50px;
	float: left;
	background-color: #fff100;
	position: fixed;
	z-index: 10;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
}
#nav {
	margin-left: 10px;
	margin-top: 3px;
	padding: 10px;
	width: 25px;
	background-color: #fff100;
}

#nav-drawer {
  position: relative;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 25px;/*長さ*/
  border-radius: 3px;
  background: #fff;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;/*最前面に*/
	width: 80%;/*右側に隙間を作る（閉じるカバーを表示）*/
	max-width: 330px;/*最大幅（調整してください）*/
	height: 100%;
	background: #fff100;/*背景色*/
	transition: .3s ease-in-out;/*滑らかに表示*/
	-webkit-transform: translateX(-105%);
	transform: translateX(-105%);/*左に隠しておく*/
	color: #e5007f;
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
	-webkit-transform: translateX(0%);
	transform: translateX(0%);/*中身を表示（右へスライド）*/
	box-shadow: 6px 0 25px rgba(255,255,255,0.15);
	-webkit-box-shadow: 6px 0 25px rgba(255,255,255,0.15);
}
#nav ul{
	float: left;
	padding: 0px;
	margin: 0px;
}
#nav li{
	padding-top: 10px;
	padding-left: 10px;
}
 
.he1 {
	width: 9%;
	float: right;
	padding-right: 1%;
	padding-top: 7px;
	text-align: right;
}
.he2 {
	width: 80%;
	float: left;
	text-align: center;
  display:none;
}
.he3 {
	width: 10%;
	float: left;
	margin-top: px;
  display:none;
}
.cen {
	width: 100%;
	text-align: center;
	padding: 0px;
	float: left;
	margin-top: 34px;
	margin-bottom: 0px;
	margin-right: auto;
	margin-left: auto;
	left: 0px;
	top: 0px;
	bottom: 0px;
	right: 0px;

}
.main1 {
	width: 100%;



  padding-top: calc(2710 / 1920 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
	background: url(img/main_d4.jpg) center center / cover no-repeat;
	float: left;
	margin-top: px;
	height: auto;
  display:none;
}
.main2 {
	width: 100%;



  padding-top: calc(2710 / 1920 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
	background: url(img/main_d4.jpg) center center / cover no-repeat;
	float: left;
	margin-top: px;
	height: auto;
}

.tw {
	width: 20%;
	float: left;
	left: 76%;
	top: 49%;
	right: 0px;
	text-align: right;
	position: absolute;
}
.cre {
	width: 100%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
img {  
     max-width: 100%;  
     height: auto;  
}
.sound {
	float: right;
}

.sound a {
	display: block;
	width: 36px;
	height: 33px;
	background: #EFEFEE url(img/common/btn_sound2.png) no-repeat 15px center;
}

.sound .pause {
	display: none;
	background: #EFEFEE url(img/common/btn_sound.png) no-repeat 15px center;
}
.pa10 {
	padding-top: 10px;
}
#int {
	width: 100%;
	text-align: center;
	padding-top: 1px;
	padding-bottom: 1px;
	color: #e5007f;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.pa50 {
	padding-bottom: 100px;
}
.bbb {
	font-size: 36px;
	padding-bottom: 30px;
	font-weight: bold;
	color: #e5007f;
}
.int_t {
	background-size: cover;
	float: left;
	background-image: url(img/intro_b.jpg);
	background-position: top right;
	background-repeat: no-repeat;
}
.int_text {
	width: 86%;
	margin: 5%;
	font-size: medium;
	text-align: left;
	line-height: 26px;
	letter-spacing: 1px;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 2%;
	padding-bottom: 2%;
	font-weight: 600;
	height: auto;
	float: left;
	color: #333333;
	background-color: #FFFFFF;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}
.story_t {
	background-size: cover;
	float: left;
	background-image: url(img/story_b.jpg);
	background-position: top left;
	background-repeat: no-repeat;
}
.story_text {
	width: 86%;
	margin: 5%;
	font-size: medium;
	text-align: left;
	line-height: 26px;
	letter-spacing: 1px;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 2%;
	padding-bottom: 2%;
	font-weight: 600;
	height: auto;
	float: left;
	color: #fff;
	background-color: #000000;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}
#s {
	width: 100%;
	float: left;
	height: 200px;
	background-color: #0066CC;
}

#is_sli {
	width: 100%;
	float: left;
}

#footer {
	float: left;
	width: 100%;
	max-width: px;
	top: 0px;
	left: 0px;

	padding-top: 1%;
	padding-bottom: 1%;
	text-align: center;
	font-size: 14px;
	color: #FFF;
	letter-spacing: 1px;
	background-color: #343c3f;
}
#cast {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.cast_t {
	width: 100%;
	float: left;
	background-color: #000;
}
#videoarea {
	display:block;
    width:100%;
    height:0x;
    margin:10px auto;
}
#playlist {
    display:table;
    list-style-type: none;
}
#playlist li{
    cursor:pointer;
    padding:12px 8px;
    border:1px solid silver;
    margin:5px 250px;
}

#playlist li:hover{
    background-color: #0CC;
	border: 1px solid silver;
	color: #FFF;                        
}
#videoarea2 {
	display:block;
    width:100%;
    height:0x;
    margin:10px auto;
}
#playlist2 {
    display:table;
    list-style-type: none;
}
#playlist2 li{
    cursor:pointer;
    padding:12px 8px;
    border:1px solid silver;
    margin:5px 250px;
}

#playlist2 li:hover{
    background-color: #0CC;
	border: 1px solid silver;
	color: #FFF;                        
}
.tw_sp {
	width: 100%;
	height: auto;
	float: left;
}
.sp1 {
	width: 60%;
	float: left;
	margin-left: 5%;
}
.sp2 {
	width: 32%;
	float: left;
	text-align: right;
	margin-right: 2%;
	margin-left: 1%;
	padding-top: 10px;
}
.sp3 {
	width: 94%;
	float: left;
	margin-left: 3%;
	margin-right: 3%;
	display:none;
}
.pa5 {
	padding-top: 5px;
}
.kara {
	float: left;
}
.cre1 {
	display:none;
}
.cre2 {

}
.cre3 {
	display:none;
}
.int1 {

}
.int2 {
	display:none;
}
.par20{
	padding-right: 15px;
	padding-left: 15px;
}
.r15{
	padding-right: 15px;
}
.resizeimage img { width: 24.8%; }
.fl {
	float: left;
}
#staff {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.staff_t {
	width: 100%;
	float: left;
	background-color: #000;
}
.kara {
	float: left;
}
.cast_d {
	display:none;
}
.cast_s {

}
.cast_o1 {
	display:none;
}
.cast_o2 {

}
.staff_d {
	display:none;
}
.staff_s {

}
.staff_o1 {
	display:none;
}
.staff_o2 {

}
#theater {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.w100 {
	width: 100%;
	float: left;
}
dl{
	width: 76%;
	float: left;
	margin-left: 12%;
	margin-right: 12%;
	color: #000;
	font-size: x-large;
	text-align: left;
	margin-top: 20px;
	}
dt {
	float: left;
	width: 100px;
	color: #000;
	font-size: large;
	margin-left: 0px;
}

dd {
	float: left;
	color: #000;
	font-size: large;
	width: 180px;
	margin-left: 0px;
}
.mt1{
	width: 80%;
	float: left;
	margin-left: 10%;
	margin-right: 10%;
	color: #000;
	font-size: medium;
	text-align: left;
	margin-top: 20px;
	}
.mt2 {
	float: left;
	width: 18%;
	color: #000;
	font-size: medium;
	margin-left: 0px;
}

.mt3 {
	float: left;
	color: #000;
	font-size: medium;
	width: 58%;
	margin-left: 0px;
}

.mt4 {
	float: left;
	color: #000;
	font-size: medium;
	width: 24%;
	margin-left: 0px;
}
.chihou1{
	width: 84%;
	text-align: left;
	float: left;
	margin-left: 8%;
	margin-right: 8%;
	color: #e5007f;
	font-size: x-large;
	margin-top: 30px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 2px solid #e5007f;
	font-weight: bold;
	}
.chihou2{
	width: 84%;
	text-align: left;
	float: left;
	margin-left: 8%;
	margin-right: 8%;
	color: #e5007f;
	font-size: x-large;
	margin-top: 40px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 2px solid #e5007f;
	font-weight: bold;
	}
#comment {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: 50px;
	background-color: #e5007f;
	float: left;
}
.comment_t{
	width: 80%;
	text-align: left;
	float: left;
	margin-left: 10%;
	margin-right: 10%;
	color: #000;
	font-size: large;
	margin-top: 30px;
	padding-top: 5px;
	padding-bottom: 30px;
	border-bottom: 1px dotted #000;
	font-weight: normal;
	line-height: 30px;
	letter-spacing: 1px;
	margin-bottom: px;
	}
.comment_name{
	width: 100%;
	text-align: left;
	float: left;
	color: #000;
	font-size: large;
	margin-top: 30px;
	font-weight: normal;
	letter-spacing: 1px;
	}
#original {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.ori50 {
	width: 80%;
	margin-left: 10%;
	margin-right: 10%;
	padding-top: 50px;
	float: left;
	padding-bottom: 50px;
}
*{
    margin: 0;
    padding: 0;

}



}
@media only screen and (max-width: 480px) {
body {
    margin: 0;
    padding: 0;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	background-color: #fff100;
}

header {
	width: 100%;
	color: #e5007f;
	text-align: left;
	background-color: rgba(255,255,255,0.1);
	height: 50px;
	float: left;
	background-color: #fff100;
	position: fixed;
	z-index: 10;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
}
#nav {
	margin-left: 10px;
	margin-top: 3px;
	padding: 10px;
	width: 25px;
	background-color: #fff100;
}
.cen1 {
	min-height: 100%;
	width: 100%;
	max-width: 480px;
	padding: 0px;
	margin-top: 0px;
	margin-right: auto;
	margin-left: auto;
	overflow:hidden;

}
#nav-drawer {
  position: relative;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 25px;/*長さ*/
  border-radius: 3px;
  background: #fff;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;/*最前面に*/
	width: 80%;/*右側に隙間を作る（閉じるカバーを表示）*/
	max-width: 330px;/*最大幅（調整してください）*/
	height: 100%;
	background: #fff100;/*背景色*/
	transition: .3s ease-in-out;/*滑らかに表示*/
	-webkit-transform: translateX(-105%);
	transform: translateX(-105%);/*左に隠しておく*/
	color: #e5007f;
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
	-webkit-transform: translateX(0%);
	transform: translateX(0%);/*中身を表示（右へスライド）*/
	box-shadow: 6px 0 25px rgba(255,255,255,0.15);
	-webkit-box-shadow: 6px 0 25px rgba(255,255,255,0.15);
}
#nav ul{
	float: left;
	padding: 0px;
	margin: 0px;
}
#nav li{
	padding-top: 20px;
	padding-left: 20px;
}
 
.he1 {
	width: 9%;
	float: right;
	padding-right: 1%;
	padding-top: 7px;
	text-align: right;
}
.he2 {
	width: 80%;
	float: left;
	text-align: center;
  display:none;
}
.he3 {
	width: 10%;
	float: left;
	margin-top: px;
  display:none;
}
.cen {
	width: 100%;
	text-align: center;
	padding: 0px;
	float: left;
	margin-top: 34px;
	margin-bottom: 0px;
	margin-right: auto;
	margin-left: auto;
	left: 0px;
	top: 0px;
	bottom: 0px;
	right: 0px;

}
.main1 {
	width: 100%;



  padding-top: calc(2710 / 1920 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
	background: url(img/main_d4.jpg) center center / cover no-repeat;
	float: left;
	margin-top: px;
	height: auto;
  display:none;
}
.main2 {
	width: 100%;



  padding-top: calc(2710 / 1920 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
	background: url(img/main_d4.jpg) center center / cover no-repeat;
	float: left;
	margin-top: px;
	height: auto;
}

.tw {
	width: 20%;
	float: left;
	left: 76%;
	top: 49%;
	right: 0px;
	text-align: right;
	position: absolute;
}
.cre {
	width: 100%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
img {  
     max-width: 100%;  
     height: auto;  
}
.sound {
	float: right;
}

.sound a {
	display: block;
	width: 36px;
	height: 33px;
	background: #EFEFEE url(img/common/btn_sound2.png) no-repeat 15px center;
}

.sound .pause {
	display: none;
	background: #EFEFEE url(img/common/btn_sound.png) no-repeat 15px center;
}
.pa10 {
	padding-top: 10px;
}
#int {
	width: 100%;
	text-align: center;
	padding-top: 1px;
	padding-bottom: 1px;
	color: #e5007f;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.pa50 {
	padding-bottom: 100px;
}
.bbb {
	font-size: 36px;
	padding-bottom: 30px;
	font-weight: bold;
	color: #e5007f;
}
.int_t {
	background-size: cover;
	float: left;
	background-image: url(img/intro_b.jpg);
	background-position: top right;
	background-repeat: no-repeat;
}
.int_text {
	width: 86%;
	margin: 5%;
	font-size: medium;
	text-align: left;
	line-height: 26px;
	letter-spacing: 1px;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 2%;
	padding-bottom: 2%;
	font-weight: 600;
	height: auto;
	float: left;
	color: #333333;
	background-color: #FFFFFF;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}
.story_t {
	background-size: cover;
	float: left;
	background-image: url(img/story_b2.jpg);
	background-position: top left;
	background-repeat: no-repeat;
}
.story_text {
	width: 86%;
	margin: 5%;
	font-size: medium;
	text-align: left;
	line-height: 26px;
	letter-spacing: 1px;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 2%;
	padding-bottom: 2%;
	font-weight: 600;
	height: auto;
	float: left;
	color: #fff;
	background-color: #000000;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}
#s {
	width: 100%;
	float: left;
	height: 200px;
	background-color: #0066CC;
}

#is_sli {
	width: 100%;
	float: left;
}

#footer {
	float: left;
	width: 100%;
	max-width: px;
	top: 0px;
	left: 0px;

	padding-top: 1%;
	padding-bottom: 1%;
	text-align: center;
	font-size: 14px;
	color: #FFF;
	letter-spacing: 1px;
	background-color: #343c3f;
}
#cast {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.cast_t {
	width: 100%;
	float: left;
	background-color: #000;
}
#videoarea {
	display:block;
    width:100%;
    height:0x;
    margin:10px auto;
}
#playlist {
    display:table;
    list-style-type: none;
}
#playlist li{
    cursor:pointer;
    padding:12px 8px;
    border:1px solid silver;
    margin:5px 250px;
}

#playlist li:hover{
    background-color: #0CC;
	border: 1px solid silver;
	color: #FFF;                        
}
#videoarea2 {
	display:block;
    width:100%;
    height:0x;
    margin:10px auto;
}
#playlist2 {
    display:table;
    list-style-type: none;
}
#playlist2 li{
    cursor:pointer;
    padding:12px 8px;
    border:1px solid silver;
    margin:5px 250px;
}

#playlist2 li:hover{
    background-color: #0CC;
	border: 1px solid silver;
	color: #FFF;                        
}
.tw_sp {
	width: 100%;
	height: auto;
	float: left;
}
.sp1 {
	width: 94%;
	float: left;
	margin-left: 3%;
	margin-right: 3%;
}
.sp2 {
	width: 32%;
	float: left;
	text-align: center;
	margin-left: 2%;
	margin-right: 3%;
	padding-top: 10px;
	display: none;
}
.sp3 {
	width: 94%;
	float: left;
	margin-left: 3%;
	margin-right: 3%;
}
.pa5 {
	padding-top: 5px;
}
.kara {
	float: left;
}
.cre1 {
	display:none;
}
.cre2 {
	display:none;
}
.cre3 {

}
.int1 {

}
.int2 {

}
.par20{
	padding-right: 15px;
	padding-left: 15px;
}
.r15{
	padding-right: 15px;
}
.resizeimage img { width: 50%; }
.fl {
	float: left;
}
#staff {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.staff_t {
	width: 100%;
	float: left;
	background-color: #000;
}
.kara {

	width: 100%;
}
.cast_d {
	display:none;
}
.cast_s {

}
.cast_o1 {
	display:none;
}
.cast_o2 {

}
.staff_d {
	display:none;
}
.staff_s {

}
.staff_o1 {
	display:none;
}
.staff_o2 {

}
#theater {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
dl{
	width: 88%;
	float: left;
	margin-left: 6%;
	margin-right: 6%;
	color: #000;
	font-size: x-large;
	text-align: left;
	margin-top: 20px;
	}
dt {
	float: left;
	width: 90px;
	color: #000;
	font-size: small;
	margin-left: 0px;
}

dd {
	float: left;
	color: #000;
	font-size: small;
	width: 160px;
	margin-left: 0px;
}
.mt1{
	width: 92%;
	float: left;
	margin-left: 4%;
	margin-right: 4%;
	color: #000;
	text-align: left;
	margin-top: 20px;
	font-size: x-small;
	}
.mt2 {
	float: left;
	width: 18%;
	color: #000;
	font-size: small;
	margin-left: 0px;
}

.mt3 {
	float: left;
	color: #000;
	font-size: small;
	width: 54%;
	margin-left: 0px;
}

.mt4 {
	float: left;
	color: #000;
	font-size: small;
	width: 28%;
	margin-left: 0px;
}
.chihou1{
	width: 92%;
	text-align: left;
	float: left;
	margin-left: 4%;
	margin-right: 4%;
	color: #e5007f;
	font-size: small;
	margin-top: 30px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 2px solid #e5007f;
	font-weight: bold;
	}
.chihou2{
	width: 92%;
	text-align: left;
	float: left;
	margin-left: 4%;
	margin-right: 4%;
	color: #e5007f;
	font-size: small;
	margin-top: 40px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 2px solid #e5007f;
	font-weight: bold;
	}
#comment {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: 50px;
	background-color: #e5007f;
	float: left;
}
.comment_t{
	width: 90%;
	text-align: left;
	float: left;
	margin-left: 5%;
	margin-right: 5%;
	color: #000;
	font-size: medium;
	margin-top: 30px;
	padding-top: 5px;
	padding-bottom: 30px;
	border-bottom: 1px dotted #000;
	font-weight: normal;
	line-height: 30px;
	letter-spacing: 1px;
	margin-bottom: px;
	}
.comment_name{
	width: 100%;
	text-align: left;
	float: left;
	color: #000;
	font-size: medium;
	margin-top: 30px;
	font-weight: normal;
	letter-spacing: 1px;
	}
#original {
	width: 100%;
	text-align: center;
	color: #e5007f;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -2px;
	background-color: #e5007f;
	float: left;
}
.ori50 {
	width: 80%;
	margin-left: 10%;
	margin-right: 10%;
	padding-top: 50px;
	float: left;
	padding-bottom: 50px;
}
.w100 {
	width: 100%;
	float: left;
}
*{
    margin: 0;
    padding: 0;

}



}