@charset "euc-jp";
/* CSS Document */

body,html {
	height:100%;	
}

body {
	margin: 0px;
	padding: 0px;
	background-color: #f7f5ea;
	font-size:16px;
	line-height:2.2em;
	color:#2b2b2b;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

a:hover img {
	filter:brightness(110%);
}

.text-bold {
	font-weight:bold;
}

.notice {
	font-size:0.8em;
}

/* -------------------------------------------------
header
-------------------------------------------------*/
h1 {
	display:block;
	text-align:center;
	padding:16px 0;
	background-color:#9d1c33;
	background-image:url(../images/logo_header_bg.png);
	background-position:bottom;
	background-repeat:repeat-x;;
}

#menu-btn {
	position:absolute;
	width:60px;
	height:60px;
	overflow:hidden;
	right:20px;
	top:11px;
	cursor: pointer;
	display:none;
}

#menu-btn img.active {
	margin-top:-60px;
}

/* -------------------------------------------------
menu
-------------------------------------------------*/

#menu {
	display: block;
	background-color: #28527e;	
	text-align:center;
	padding:10px 0;
	background-image:url(../images/menu_bg.jpg);
	background-position:center center;
	background-repeat:no-repeat;
}

#menu ul {
	display:block;
	margin:0 auto;
	max-width:1100px;
	
}

#menu li {
	display:inline-block;
	color:#fff;
	font-family: FOT-筑紫Aオールド明朝 Pr6 D;
	font-feature-settings : "palt" 1;
	font-size:22px;
	line-height:1em;
}

#menu li a {
	display:inline-block;
	padding:20px 25px;
	text-decoration:none;
	color:#fff;
}

#menu li.present a,
#menu li a:hover {
	color: #f8d429;
}

#menu li:nth-child(1) a {
	padding-left:56px;
	background-image:url(../images/icon_fb.png);
	background-repeat:no-repeat;
	background-position:18px center;
	background-size:24px auto;
}


/* -------------------------------------------------
hero
-------------------------------------------------*/

#hero {
	width:100%;
	height:350px;
	background-image:url(../images/header_bg_about.jpg);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;	
	text-align:center;
	position:relative;
}

#hero h2 {
	color: #fff;
	font-family: FOT-筑紫Aオールド明朝 Pr6 E;
	font-feature-settings : "palt" 1;
	font-size: 40px;
	position:absolute;
	top:160px;
	left:50%;
	margin-left:-2em;
	text-shadow: 0px 0px 4.45px rgba(0, 0, 0, 0.88);
}

#hero.staff {
	background-image:url(../images/header_bg_staff.jpg);
	margin-bottom:30px;
}

#hero.comments {
	background-image:url(../images/header_bg_comments.jpg);
}

/* -------------------------------------------------
content
-------------------------------------------------*/

#content-container {
	margin:0 auto;
	width:1100px;
	padding:40px 30px;
	font-size:1.2em;
	line-height:1.8em;
}

#content-container p {
	margin-bottom:1.8em;
}

/* about */

#content-container.about h3 {
	text-align:center;
	margin-bottom:30px;
}

#content-container.about h3 img.pc {
	display:inlne;
}


#content-container.about h3 img.sp {
	display:none;
}

#content-container.about ul {
	margin-bottom:60px;
}

#content-container.about li {
	display:block;
	width:25%;
	float:left;
}

#content-container.about li img {
	width:100%;
	height:auto;
}

/* staff */

#content-container.staff h3 {
		color: #1c1c1c;
	font-family: FOT-筑紫Aオールド明朝 Pr6 E;
	font-feature-settings : "palt" 1;
	font-size: 1.8em;
	margin-bottom:0.6em;
}

#content-container.staff h3 span.name {
	margin-right:0.2em;
	display:inline-block;
	line-height:1.5em;
}

#content-container.staff h3 span.katagaki {
	margin-right:0.5em;
	color:#9d1c33;
	font-size:0.8em;
	display:inline-block;
	line-height:1.5em;
}

#content-container.staff h3 span.furigana {
	color:#1c1c1c;
	font-size:0.6em;
	display:inline-block;
	line-height:1.5em;
}

#content-container.staff p {
	font-size:0.8em;
	line-height:1.8em;
	margin-bottom:40px;
}

#content-container.staff p img {
	float:left;
	margin:0 40px 40px 0;
}

#content-container.staff h4 {
	background-image: url(../images/allow_down.png);
	background-repeat: no-repeat;
	background-position: left 8px;
	color: #1c1c1c;
	font-family: FOT-筑紫Aオールド明朝 Pr6 E;
	font-feature-settings : "palt" 1;
	font-size: 1.4em;
	padding: 0 0 0.6em 2em;
	margin:-40px 0 1.5em 0;
	cursor: pointer;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #cbcbcb;
}

#content-container.staff h4.active {
	background-image: url(../images/allow_up.png); 
}

#shoureki-wrapper {
	display:none;
	margin-bottom:40px;
}

.shoureki {
	margin-bottom:20px;
	
}

.shoureki-left {
	width: 120px;
	float: left;
	font-weight:bold;
	text-align:right;
	padding-right:20px;
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: #333;	
	font-size:0.8em;
}

.shoureki-right {
	width:940px;
	float:right;
}

#content-container.staff .shoureki-right p {
	margin-bottom:1em;
}

/* cooments */

#content-container.comments {
	width:840px;
}

#content-container.comments h3 {
		color: #1c1c1c;
	font-family: FOT-筑紫Aオールド明朝 Pr6 E;
	font-feature-settings : "palt" 1;
	font-size: 2em;
	margin:0.2em 0;
}

#content-container.comments h3 span.name {
	margin-right:0.5em;
	display:inline-block;
	line-height:1.5em;
}

#content-container.comments h3 span.katagaki {
	color:#9d1c33;
	font-size:0.6em;
	display:inline-block;
	line-height:1.5em;
}

#content-container.comments p {
	margin-bottom:40px;
}

/* trailer */

#content-container.trailer h2 {
	color: #1c1c1c;
	font-family: FOT-筑紫Aオールド明朝 Pr6 E;
	font-feature-settings : "palt" 1;
	font-size: 1.8em;
	text-align:center;
	margin:0.5em 0 1em 0;
	line-height:1.4em;
}

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

/* theater */

#content-container.theater h2 {
	color: #1c1c1c;
	font-family: FOT-筑紫Aオールド明朝 Pr6 E;
	font-feature-settings : "palt" 1;
	font-size: 1.8em;
	text-align:center;
	margin:1.5em 0 1em 0;
	line-height:1.4em;
}

#roadshow,
#map,
#maeuri,
#online {
	text-align:center;
	margin:0 0 1.5em 0;
}

#maeuri {
	color: #00694e;
	font-family: FOT-筑紫Aオールド明朝 Pr6 E;
	font-feature-settings : "palt" 1;
	font-size: 1.8em;
	text-align:center;
	line-height:1.4em;
}

#maeuri span {
	font-size:0.5em;
}

/* イベント情報用テーブル */

#event-container {
	margin-top:30px;
	margin-bottom:60px;
}

#event-container table {
	width:100%;
	margin-bottom:20px;
}

#event-container table tr.header td {
	border:none;
}

#event-container table tr.header td {
	background-color:#425071;
	text-align:left;
	font-size:1.0em;
	font-weight:bold;
	color:#fff;
	padding:0.5em 1em;
}

#event-container table tr td {
	background-color:#fff;
	text-align:left;
	padding:1.5em 1em;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #e1e1e1;
	line-height:1.4em;
	font-size:0.8em;
}

ul.event-notice li {
	font-size:0.8em;
	text-align:left;
	line-height:1.4em;
	margin-bottom:0.4em;
}

/* 上映劇場用テーブル */

.theater-table {
	border-collapse: collapse;
	border: none;
	border-spacing: 0;
	width: 100%;
	margin-top: 20px;
	margin-bottom: 40px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:0.8em;
}

.theater-table tr.header td {
	background-color:#425071;
	color:#fff;
}

.theater-table td {
	padding: 1.4em 1em;
	border: 1px solid #cccccc;
	background-color: #FFF;
	line-height:1.4em;
}

.theater-table td a {
	color: #103095;
	text-decoration: none;
}

.theater-table td a:hover {
	text-decoration: underline;
}

/* supporters */

#content-container.supporters h2 {
	color: #1c1c1c;
	font-family: FOT-筑紫Aオールド明朝 Pr6 E;
	font-feature-settings : "palt" 1;
	font-size: 1.8em;
	text-align:center;
	margin:1em 0 1.6em 0;
	line-height:1.4em;
}

#contact-container {
	padding:1.5em 2em;
	background-color:#ebe6cc;
	font-size:0.9em;	
	line-height:1.8em;
	margin-bottom:30px;
}

#contact-container h3 {
	font-weight:bold;	
	margin-bottom:0.5em;
}

#contact-container p {
	margin-bottom:0;
}

#content-container.supporters ul {
	display: flex;
	flex-wrap: wrap;
	font-size:0.8em;
	line-height:1.4em;
}

#content-container.supporters ul ol {
	width:30%;
	margin-right:3%;
	margin-bottom:40px;
}

#content-container.supporters ul ol li {
	margin-bottom: 1em;
}


@media only screen and (max-width: 800px) {

/* -------------------------------------------------
menu 800
-------------------------------------------------*/

#menu {
	display: block;
	background-color: #0a6a8d;	
	text-align:center;
}

#menu li {
	font-size:16px;
	line-height:1em;
}

#index-menu li a {
	display:inline-block;
	padding:20px 25px;
	text-decoration:none;
	color:#fff;
}

#index-menu li:nth-child(1) a {
	padding-left:56px;
	background-image:url(../images/icon_fb.png);
	background-repeat:no-repeat;
	background-position:18px center;
	background-size:24px auto;
}


/* -------------------------------------------------
hero 800
-------------------------------------------------*/

#hero {
	width:100%;
	height:200px;
	background-image:url(../images/header_bg_about.jpg);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;	
	text-align:center;
	position:relative;
}

#hero h2 {
	color: #fff;
	font-family: FOT-筑紫Aオールド明朝 Pr6 E;
	font-feature-settings : "palt" 1;
	font-size: 30px;
	position:absolute;
	top:80px;
	left:50%;
	margin-left:-2em;
	text-shadow: 0px 0px 4.45px rgba(0, 0, 0, 0.88);
}

#hero.staff {
	margin-bottom:10px;
}

/* -------------------------------------------------
content 800
-------------------------------------------------*/

#content-container,
#content-container.comments {
	margin:0 auto;
	width:92%;
	padding:30px 0;
	font-size:0.9em;
	line-height:1.8em;
}

#content-container p {
	margin-bottom:1.4em;
}

/* about */

#content-container.about h3 {
	text-align:center;
	margin-bottom:15px;
}

#content-container.about h3 img.pc {
	display:none;
}

#content-container.about h3 img.sp {
	display:inline;
	width:100%;
	height:auto;
}

#content-container.about ul {
	margin-bottom:30px;
}

#content-container.about li {
	display:block;
	width:50%;
	float:left;
}

#content-container.about li img {
	width:100%;
	height:auto;
}

/* staff */

#content-container.staff h3 {
	font-size: 1.5em;
}

#content-container.staff p {
	font-size:0.8em;
	line-height:1.8em;
	margin-bottom:25px;
}

#content-container.staff p img {
	float:left;
	margin:0 20px 20px 0;
	width:35%;
	height:auto;
}

#content-container.staff h4 {
	background-image: url(../images/allow_down.png);
	background-repeat: no-repeat;
	background-size:18px auto;
	background-position: left 4px;
	color: #1c1c1c;
	font-family: FOT-筑紫Aオールド明朝 Pr6 E;
	font-feature-settings : "palt" 1;
	font-size: 1.2em;
	padding: 0 0 0.6em 2em;
	margin:0px 0 2.5em 0;
	cursor: pointer;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #cbcbcb;
}

#content-container.staff h4.active {
	background-image: url(../images/allow_up.png); 
	margin:0px 0 1em 0;
}

#shoureki-wrapper {
	display:none;
	margin-bottom:30px;
}

.shoureki {
	margin-bottom:20px;
}

.shoureki-left {
	width: auto;
	display:block;
	float: none;
	font-weight:bold;
	text-align:left;
	padding-right:0px;
	border:none;	
	font-size:0.8em;
	font-size:1.0em;
	margin-bottom:1em;
}

.shoureki-right {
	width:auto;
	float:none;
}

#content-container.staff .shoureki-right p {
	margin-bottom:1em;
}


/* comments */

#content-container.comments h3 {
	font-size: 1.4em;
	margin:0.2em 0;
}

#content-container.comments h3 span.name {
	margin-right:0.5em;
	display:inline-block;
	line-height:1.5em;
}

#content-container.comments h3 span.katagaki {
	color:#9d1c33;
	font-size:0.6em;
	display:inline-block;
	line-height:1.5em;
}

#content-container.comments p {
	margin-bottom:20px;
}

/* supporters */

#content-container.supporters h2 {
	margin:0.6em 0 1.0em 0;
}

#content-container.supporters ul {
	display: flex;
	flex-wrap: wrap;
	font-size:0.8em;
	line-height:1.4em;
}

#content-container.supporters ul ol {
	width:42%;
	margin-right:8%;
	margin-bottom:30px;
}

#content-container.supporters ul ol li {
	margin-bottom: 1em;
}

/* theater */

#roadshow,
#map,
#maeuri,
#online {
	text-align:center;
	margin:0 0 1.5em 0;
}

#roadshow img {
	width:90%;
	height:auto;
}

#map img {
	width:100%;
	height:auto;
}

#online img {
	width:90%;
	height:auto;
}

#maeuri {
	color: #00694e;
	font-family: FOT-筑紫Aオールド明朝 Pr6 E;
	font-feature-settings : "palt" 1;
	font-size: 1.2em;
	text-align:center;
	line-height:1.4em;
}

#event-container table tr td {
	padding:1.5em 0.6em;
}

}

@media only screen and (max-width: 480px) {
	
body {
	margin-top:60px;
}
	
/* -------------------------------------------------
header 480
-------------------------------------------------*/

h1 {
	position:fixed;
	width:100%;
	top:0;
	left:0;
	z-index:1;
}

h1 img {
	width:160px;
	height:auto;
}

#menu-btn {
	position:fixed;
	width:40px;
	height:40px;
	overflow:hidden;
	right:16px;
	top:11px;
	cursor: pointer;
	display:block;
	z-index:2;
}

#menu-btn img {
	width:40px;
	height:auto;
}

#menu-btn img.active {
	margin-top:-40px;
}

/* -------------------------------------------------
menu 480
-------------------------------------------------*/

#menu {
	background-color: #3a6898;
	padding:0;
	background-image:none;
	position:fixed;
	top:60px;
	left:0;
	z-index:1;
	display:none;
}

#menu li {
	display: block;
	float:left;
	color: #fff;
	font-family: FOT-筑紫Aオールド明朝 Pr6 D;
	font-feature-settings : "palt" 1;
	font-size: 16px;
	line-height: 1em;
		background-color:#28527e;
	margin:0.5px;
	width:calc(50% - 1px);
}

#menu li:nth-child(7),
#menu li:last-child {
	width:calc(100% - 1px);
}

#menu li a {
	display:inline-block;
	padding:20px 25px;
	text-decoration:none;
	color:#fff;
}

#menu li:nth-child(1) a {
	padding-left:56px;
	background-image:url(../images/icon_fb.png);
	background-repeat:no-repeat;
	background-position:18px center;
	background-size:24px auto;
}


/* -------------------------------------------------
hero 480
-------------------------------------------------*/

#hero {
	width:100%;
	height:140px;
	background-image:url(../images/header_bg_about.jpg);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;	
	text-align:center;
	position:relative;
}

#hero h2 {
	color: #fff;
	font-family: FOT-筑紫Aオールド明朝 Pr6 E;
	font-feature-settings : "palt" 1;
	font-size: 26px;
	position:absolute;
	top:56px;
	left:50%;
	margin-left:-2em;
	text-shadow: 0px 0px 4.45px rgba(0, 0, 0, 0.88);
}

#hero.staff {
	margin-bottom:10px;
}

}
