/*---------////////
#　UDD ppk
quoted from #501alpha Ardeidae PT.9
---------*/


/*---------////////
A要素・HTML要素
---------*/
A:link { color: #E8B75A; }
A:visited { color: #E8B75A; }
A:active { color: #ffb; }
A:hover { color: #ffb; }


/*---------////////
ボディ　WEBページ全体の余白を削除
---------*/

body
{
background-color: #142043;
background-repeat: repeat;
background-position: right top ;
background-attachment: fixed;
font-family: "Yu Gothic UI","Meiryo","ヒラギノ角ゴシック","San Francisco";
margin: 0;
padding: 0;
}


.space_com
{
padding: 22px 0 720px;
text-align: center;
}


/*fadein_top_1.フェードインアニメーションの指定*/
.scrollanime {opacity: 0;} /*一瞬表示されるのを防ぐ*/
.fadeInDown {
    animation-name: fadeInDown;
    animation-duration: 4s;
    animation-fill-mode: forwards;
}
@keyframes fadeInDown {
    0% {
        opacity: 0;         
    }
    100% {
    opacity: 1;
    transform: translate(0);
    }
}
 
/*fadein_top_2.上下の動きを指定*/
.updown {transform: translateY(-100px);}
.downup {transform: translateY(100px);}
 
/*3.左右の動きを指定*/
.sect02{overflow: hidden;} /*横スクロールバーを隠す*/
.slide-right {transform: translateX(200px);}
.slide-left {transform: translateX(-200px);}



/*---------////////
コンテナー　ページの外枠
---------*/


#wrap 
{
padding-bottom: 180px;
box-sizing: border-box;
}


.footer2
{
position: fixed;
bottom: 0;
width: 100%;
height: 180px;
background-color: #E8B75A;
color: #F4F1F6;
text-align: center;
}

/*#4d0d25*/


#container
{
width: 960px;
margin: 0px auto 0px;
}

/*---------////////
コンテンツ　本文
---------*/

#content
{
background-position:bottom center;
background-color:#1B2A59;
/*background: rgba(255,255,255,0.8);
background:url(img/bg_sk.png);
background-repeat:repeat-y*/
text-align	: left;
margin: 0;
padding: 0;
}

.content_intro
{
	height:680px;
	font-size:21px;
    font-weight:bold;
	color:#fff;
    text-align: center;
	padding-top: 300px;
}

.dli-chevron-down {
  display: inline-block;
  vertical-align: middle;
  color: #E8B75A;
  line-height: 1;
  width: 1em;
  height: 1em;
  border: 0.3em solid currentColor;
  border-left: 0;
  border-bottom: 0;
  box-sizing: border-box;
  transform: translateY(-25%) rotate(135deg);
}


/*---------////////
#content p
{
margin: 0;
padding: 0;
}


#content img
{
margin: 0;
padding: 0;
}
---------*/

.btn {
    width:840px;
    font-size:48px;
    font-weight:bold;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:18px 0 20px;
    margin:0px 60px;
    color:#F4F1F6;
    background-color:#262626;
    border-radius:8px;
    box-shadow:2px 2px #999999;
}

.btn_rsvcast {
    width:250px;
    font-size:14px;
    font-weight:bold;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:9px 0 9px;
    margin:12px 0px 22px;
    color:#F4F1F6;
    background-color:#c46a77;
    border-radius:3px;
    box-shadow:2px 2px #999999;
}
.btn_rsvcast_u {
    width:250px;
    font-size:14px;
    font-weight:bold;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:9px 0 9px;
    margin:0px 0px 44px;
    color:#F4F1F6;
    background-color:#E8B75A;
    border-radius:3px;
    box-shadow:2px 2px #999999;
}


.btn_rsvcast2 {
    width:240px;
    font-size:16px;
    font-weight:bold;
    text-decoration:none;
    display:inline-block;
    text-align:center;
    padding:18px 0;
    margin:12px 18px 22px;
    color:#F4F1F6;
    background-color:#c46a77;
    border-radius:3px;
    box-shadow:2px 2px #999999;
}

.btn_rsvcast2_u {
    width:240px;
    font-size:16px;
    font-weight:bold;
    text-decoration:none;
    display:inline-block;
    text-align:center;
    padding:18px 0;
    margin:12px 18px 44px;
    color:#F4F1F6;
    background-color:#E8B75A;
    border-radius:3px;
    box-shadow:2px 2px #999999;
}

.btn_rsvcast3 {
    width:480px;
    font-size:16px;
    font-weight:bold;
    text-decoration:none;
    display:inline-block;
    text-align:center;
    padding:18px 0;
    margin:12px 28px 22px;
    color:#F4F1F6;
    background-color:#c46a77;
    border-radius:3px;
    box-shadow:2px 2px #999999;
}

.btn_rsvcast3_u {
    width:480px;
    font-size:16px;
    font-weight:bold;
    text-decoration:none;
    display:inline-block;
    text-align:center;
    padding:18px 0;
    margin:12px 28px 44px;
    color:#F4F1F6;
    background-color:#E8B75A;
    border-radius:3px;
    box-shadow:2px 2px #999999;
}

.btn_r {
    width:760px;
    font-size:48px;
    font-weight:bold;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:18px 0 20px;
    margin:0px 100px;
    color:#F4F1F6;
    background-color:#c46a77;
    border-radius:3px;
    box-shadow:2px 2px #999999;

}

.sp_btn {
	width:860px;
    text-align: center;
    padding: auto;
    margin: 50px;
}

.acbtn{
    display: inline-block;
    width: 480px;
    height: 80px;
    margin: 22px 180px 22px;
    padding: 0.5em 1em;
    text-decoration: none;
    background: -webkit-linear-gradient(to right, rgb(246, 122, 80), #cc4422);
    background: linear-gradient(to right, rgb(246, 122, 80), #cc4422);/*ボタン色*/
    color: #FFF;
    font-size:26px;
    border-bottom: solid 4px #627295;
    border-radius: 8px;
    text-align: center;
}
.acbtn:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/
}

b.w
{
font-size: 1.8em;
}

b.tri
{
font-size: 2.8em;
}

b.t{color:#00c;}
b.o{color:#0c0;}
b.b{color:#c00;}


.img_wrap{
  margin: 0 auto;
  overflow: hidden;
}
.img_wrap img{
  width: 100%;
}





/*
h1
{
  color : #f79;
  font-size:48px;
  letter-spacing: 0.14em;
  text-align: center;
  position: relative;
  margin-top: 88px;
  margin-bottom: 22px;
  margin-left: 0px;
  margin-right: 0px;
  padding-top: 1em;  
  padding-bottom: 0em;
  padding-right: 22px;
  padding-left: 22px;
  border-bottom: 8px solid #cdb981;

}
*/


/*h1 {
  font-size:36px;
  letter-spacing: 0.14em;
  text-align: center;
  position: relative;
  padding: 0.4em;
  color: #fff;
  margin-top: 44px;
  margin-bottom: 22px;
  margin-left: 44px;
  margin-right: 44px;
  background: -webkit-linear-gradient(to left, rgb(102, 148, 176), #00374a);
  background: linear-gradient(to left, rgb(102, 148, 176), #00374a);
  box-shadow: 0 0 4px rgba(0, 0, 33, 0.24);
  border-radius: 12px;
}*/

h1 {
	  font-family: 'Roboto', sans-serif;
 position: relative;
 margin:0 44px 22px;
  padding: 4rem 44px 1.2rem 22rem;
  border-bottom: 4px solid #E8B75A;
  color:#E8B75A;
}

h1 span {

	font-family: 'Noto Sans JP', sans-serif;
  font-size: 5rem;
  line-height: 1;
  position: absolute;
  bottom: 1.6rem;
  left: 0.5rem;
 font-weight: 900;
		color:#F4F1F6;
}



h2 {
  font-size:28px;
  margin-top: 44px;
  margin-bottom:22px;
  margin-left: 44px;
  margin-right: 44px;
  padding: 0.1em 0.5em;/*文字の上下 左右の余白*/
  color: #F4F1F6;/*文字色*/
  /*background: #;背景色*/
  border-left: double 12px #E8B75A;/*左線*/
  /*border-bottom: solid 3px #676779;下線*/
}


h3 {
  font-size:28px;
  text-align: center;
  margin-top: 44px;
  margin-bottom:22px;
  margin-left: 44px;
  margin-right: 44px;
  padding: 0.4em 0.5em;/*文字の上下 左右の余白*/
  color: #F4F1F6;/*文字色*/
  background: #E8B75A;
    border-radius:8px;
  /*border-bottom: solid 3px #676779;下線*/
}

/*---------////////
コンテンツ　メインテキスト
content_pk
---------*/


.content_pos img
{
display: block;
margin-left: auto;
margin-right: auto;
text-align: center;
width: 860px;
}

.content_pk
{
margin:44px auto 88px;
border-radius:8px;
background-size: 100%;
}

.content_pkw
{
margin:44px auto 88px;
border-radius:0px;
/*background: url(img/top2.jpg) no-repeat;*/	
background-size: 100%;
}


.sp{ display: none; }
.pc{ display: block; }

@media screen and (max-width: 768px) {
  .sp{ display: block; }
  .pc{ display: none; }
}

.ticket
{
width: 860px;
line-height: 1.6em;
font-size: 21px;
color : #fff;
display: block;
margin-top: 21px;
margin-bottom: 48px;
margin-left: auto;
margin-right: auto;
}

.ticket th
{
	width: 220px;
}
.ticket td
{
	width: 200px;
	text-align: right;
	padding-right: 80px;

}



.small_price{
	font-size:16px;
	margin-top:-20px;
}



.content_pk img
{
display: block;
margin-left: auto;
margin-right: auto;
text-align: center;
width: 960px;
}

.content_pk p
{
text-align: left;
line-height: 1.6em;
font-size: 24px;
letter-spacing: 0.05em;
padding: 24px 48px 24px 48px;
color : #F4F1F6;
}

.content_pk b
{
font-size: 28px;
}


.content_pk small
{
 font-size: 18px;
}


.content_pk b.lg
{
font-size: 38px;
	  padding: 1.8em 0em;/*文字の上下 左右の余白*/

}

.content_pk A:link { color: #F4F1F6; }
.content_pk A:visited { color: #F4F1F6; }
.content_pk A:active { color: #ccc; }
.content_pk A:hover { color: #ccc; }

.content_st2 A:link { color: #F4F1F6; }
.content_st2 A:visited { color: #F4F1F6; }
.content_st2 A:active { color: #ccc; }
.content_st2 A:hover { color: #ccc; }



.content_rsv
{
background: #e8b75a;
margin:44px auto 88px;
border-radius:8px;
}

.content_rsv img
{
display: block;
margin-left: auto;
margin-right: auto;
text-align: center;
width: 960px;
border-radius:8px 8px 0px 0px;
}

.content_rsv p
{
text-align: left;
line-height: 1.0em;
font-size: 24px;
padding-top: 24px;
color : #F4F1F6;
}

.content_rsv A:link { color: #fff; }
.content_rsv A:visited { color: #fff; }
.content_rsv A:active { color: #ccc; }
.content_rsv A:hover { color: #ccc; }


/*---------////////
コンテンツ　キャスト紹介
content_cast
---------*/


.content_cast
{
/*--  background: rgba(255,255,255,0.8); --*/
margin:44px auto 44px;
padding:22px;
border-radius:8px;
text-align: center;
}

.content_cast img
{
width: 256px;
height: 256px;
border-radius:8px;
}



.content_cast b
{
font-size: 22px;
padding:12px;
}
.content_cast small
{
font-size: 18px;
margin: 8px;
}


.content_cast A:link { color: #F4F1F6; }
.content_cast A:visited { color: #F4F1F6; }
.content_cast A:active { color: #ccc; }
.content_cast A:hover { color: #ccc; }


figure {
    display: inline-block;   /* インラインブロック化 */
	margin: 0px 22px 12px 22px; 
}
	

figure img {
    display: block;          /* 余計な余白が出ないようにする */
    margin: 0px 0px 8px 0px; /* 下側にだけ8pxの余白を追加 */
}

figcaption {

    text-align: center; 
	color:#fff;
	margin: 0px 0px 12px 0px; /* 下側にだけ12pxの余白を追加 */

}



img.cast_button:hover{
	opacity:0.5;
	cursor: pointer;
}
 
img.cast_button:active{
	position: relative;
	top: 6px;

}

.square_btn_twi{
    display: inline-block;
    font-size: 21px;
    font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
    width: 88px;
    height: 27px;
    padding: 0.2em 0.5em;
    text-decoration: none;
    background: #33ccff;/*ボタン色*/
    color: #FFF;
    border-bottom: solid 4px #627295;
    border-radius: 8px;
    text-align: center;
}
.square_btn_twi:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/
}

.square_btn_tgr{
    display: inline-block;
    width: 218px;
    height: 44px;
    padding: 0.5em 1em;
    text-decoration: none;
    background: #ffcc00;/*ボタン色*/
    color: #FFF;
    border-bottom: solid 4px #627295;
    border-radius: 8px;
    text-align: center;
}
.square_btn_tgr:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/
}


/*---------////////
コンテンツ　ストーリーテキスト
content_st
---------*/

.content_st
{
margin:44px 44px;
background:url(img/story_bg.jpg) bottom/cover no-repeat;
background-size:contain;
background-color: #410517;
border-radius:4px;
padding-bottom:180px;
}

.content_st img
{
display: block;
margin-left: auto;
margin-right: auto;
}

.content_st p
{
text-align: left;
line-height: 2.1em;
font-size: 1.1em;
padding: 48px 48px 48px 48px;
color : #F4F1F6;
}

.content_st b
{
line-height: 2.4em;
font-size: 1.3em;
color : #F4F1F6;
}

.content_st strong
{
line-height: 2.4em;
font-size: 1.4em;
color : #F4F1F6;
}

.content_st2
{
margin:44px 44px;
background:url(img/story_bg2.jpg) bottom/cover no-repeat;
background-size:contain;
background-color: #000000;
border-radius:4px;
padding-bottom:200px;
}

.content_st2 p
{
text-align: left;
line-height: 2.1em;
font-size: 1.1em;
padding: 48px 48px 48px 48px;
color : #F4F1F6;
}


/*---------
.content_pk h1
{
text-align: left;
font-size: 48px;

padding: 0px 0px 64px 48px;
color : #363433;
}
---------*/



/*---------////////
コンテンツ　スタッフ紹介
content_cast
---------*/

.content_staff table
{
width: 780px;
line-height: 1.6em;
font-size: 21px;
color : #F4F1F6;
display: block;
margin-bottom: 48px;
margin-left: auto;
margin-right: auto;
}

.content_staff th
{
	width: 140px;
}



/*---------////////
こりっち
---------*/

iframe
{
display: block;
margin-left: auto;
margin-right: auto;
}



.mobile{
    display: inline-block;
	font-size:2em;
    width: 680px;
    height: 40px;
    margin: 22px 100px 22px;
    padding: 0.5em 0.5em;
    text-decoration: none;
    background: #f36;/*ボタン色*/
    color: #FFF;
    border-bottom: solid 4px #627295;
    border-radius: 40px;
    text-align: center;
}
.mobile:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/
}

/*---------////////
.mobile
{
    width:680px;
    font-size: 62px;
    font-weight:bold;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:18px 0 20px;
    margin:0px 100px;
    color:#fff;
    background-color:#ff6666;
    border-radius:3px;
    box-shadow:2px 2px #999999;
}
---------*/

.mobile A { 
	font-size: 36px;
    margin:20px 20px;
}
.mobile A:link { color: #fff; }
.mobile A:visited { color: #fff; }
.mobile A:active { color: #ff9; }
.mobile A:hover { color: #ff9; }


/*---------////////
フッター　著作権情報
---------*/




#footer
{
clear: both;
text-align	: center;
width		: 100%;
height		: 120px;
margin		: 0;
padding		: 44px 0px;
background:url(img/footerbg.jpg) center/cover no-repeat; /*fixedをトル！*/
}


#footer p
{
font-size: 22px;
color : #F4F1F6 ;
line-height: 1.5em;
padding:0px;
}



