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

body {
	margin: 0px;
	padding: 0px;
	background-color: #ffffff;
	background-image: url(../images/content_bg.jpg);
	font-family: "¥Ò¥é¥®¥Î³Ñ¥´ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "£Í£Ó £Ð¥´¥·¥Ã¥¯", "MS PGothic", "¥á¥¤¥ê¥ª", Meiryo, sans-serif;
	font-size: 24px;
	line-height: 40px;
	padding:80px 0px 20px 0px;
}

/* header */

#header {
	position:relative;
	width:100%;
	height:330px;
	background-image: url(../images/header_wave.png),url(../images/header_bg.jpg) ;
	background-repeat: repeat-x,no-repeat;
	background-position: left bottom,center center;
	-moz-background-size:auto,cover;
	background-size:auto,cover;
}

h1 {
	position: absolute;
	left: 50%;
	top: 45px;
	margin-left: -241px;
}

h2 {
	position: absolute;
	left: 50%;
	top: 180px;
	margin-left: -283px;
}

#ouen {
	position: absolute;
	right: 39px;
	top: 11px;
}

/* menu */

#menu-open,
#menu-close {
	width:160px;
	height:80px;
	position:fixed;
	top:0px;
	right:0px;
	z-index:2;
}

#menu-close {
	display:none;
}

#menu-container {
	position: fixed;
	width: 100%;
	top: 80px;
	left: 0px;
	z-index: 2;
	background-color: #4ec2c7;
	display:none;
}

#menu-container ul {
	padding:20px;
	display:inline-flex;
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:         wrap;
	-webkit-justify-content: space-around; /* Safari */
	justify-content:         space-around;
}

#menu-container ul li {
	margin:20px 4px;
	display:inline-table;
}

/*sns*/

div#social {
	position:fixed;
	left:0px;
	top:0px;
	background-color: #4ec2c7;
	height: 80px;
	width: 100%;
}

div#social ul {
	position:fixed;
	left:20px;
	top:24px;
}

div#social ul li {
	display:inline-table;
}

div#social li.tw iframe {
	width: 86px !important;
}


/* ccontent */

#content-container {
	width:600px;
	margin:0 auto;
	padding:30px 0px 80px 0px;
}

h3 {
	padding:30px 0px 30px 0px;
	
}

h4 {
	padding:50px 0px 30px 0px;
	
}

h5 {
	padding:30px 0px 0px 0px;
	
}

h3 img,
h4 img {
	display:block;
	margin:0 auto;
}

/* about*/

#content-container.about {
	background-image: url(../images/chicken.png);
	background-repeat: no-repeat;
	background-position: 440px 32px;
}
#content-container.about p {
	margin-bottom:30px;
}

.about-pic {
	display:block;
	margin:0 auto;
	padding-bottom:20px;
}

.keyword-container {
	padding: 34px 0px 0px 0px;
	font-size: 22px;
	line-height: 36px;
}

.keyword-container h6 {
	margin-bottom: 16px;	
}

.keyword-pic {
	display:block;
	margin:0 auto;
	padding-bottom:20px;
}

.keyword-container.brown {
	background-image: url(../images/line_brown.png);
	background-repeat: repeat-x;
	background-position: left top;		
}

.keyword-container.green {
	background-image: url(../images/line_green.png);
	background-repeat: repeat-x;
	background-position: left top;		
}

.keyword-container.blue {
	background-image: url(../images/line_blue.png);
	background-repeat: repeat-x;
	background-position: left top;		
}

.keyword-container.purple {
	background-image: url(../images/line_purple.png);
	background-repeat: repeat-x;
	background-position: left top;		
}


/* trailer */

#content-container.trailer {
	text-align:center;
}

#trailer-container {
	width:600px;
	margin:0 auto;
	padding:30px 0px;
	
}

/* comments */

#content-container.comments {
	text-align: center;
}

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

/* cast*/

#content-container.cast {
	background-image: url(../images/goat.png);
	background-repeat: no-repeat;
	background-position: 350px 120px;
}

.cast-container {
	padding: 24px 0px 60px 0px;
	font-size: 22px;
	line-height: 36px;
}

.cast-container h6 {
	margin-bottom: 40px;	
}

.cast-pic {
	float: left;
	margin-top:-45px;
	margin-right: 20px;
	margin-bottom: 10px;	
}

.cast-container.purple2 .cast-pic {
	margin-top:-18px;	
}

.cast-link {
	width:100%;
	margin:20px 0px 0px 0px;
}


.cast-link a {
	color: #FFF;
	background-color: #03a6ad;
	display: table-cell;
	padding: 10px 60px 10px 20px;
	float: right;
	border-radius: 6px;        /* CSS3Áð°Æ */
	-webkit-border-radius: 6px;    /* Safari,Google ChromeÍÑ */
	-moz-border-radius: 6px;   /* FirefoxÍÑ */
	text-decoration: none;
	background-image: url(../images/arrow.png);
	background-repeat: no-repeat;
	background-position: right 16px center;
}

.cast-link a:hover {
	background-color: #25b5bb;	
}

.cast-container.purple {
	background-image: url(../images/line_purple.png);
	background-repeat: repeat-x;
	background-position: left 75px;
}

.cast-container.purple2 {
	background-image: url(../images/line_purple.png);
	background-repeat: repeat-x;
	background-position: left 112px;
}

.cast-container.brown {
	background-image: url(../images/line_brown.png);
	background-repeat: repeat-x;
	background-position: left 75px;
}

.cast-container.green {
	background-image: url(../images/line_green.png);
	background-repeat: repeat-x;
	background-position: left 75px;
}

.cast-container.blue {
	background-image: url(../images/line_blue.png);
	background-repeat: repeat-x;
	background-position: left 75px;
}


/* staff */

#content-container.staff {
	background-image: url(../images/staff.png);
	background-repeat: no-repeat;
	background-position: 410px 60px;
}

.staff-container {
	padding: 24px 0px 30px 0px;
	font-size: 22px;
	line-height: 36px;
}

.staff-container h6 {
	margin-bottom: 40px;	
}

.staff-pic {
	float: left;
	margin-top:-45px;
	margin-right: 20px;
	margin-bottom: 10px;	
}

.staff-container.purple {
	background-image: url(../images/line_purple.png);
	background-repeat: repeat-x;
	background-position: left 75px;
}

.staff-container.brown {
	background-image: url(../images/line_brown.png);
	background-repeat: repeat-x;
	background-position: left 75px;
}

.staff-container.green {
	background-image: url(../images/line_green.png);
	background-repeat: repeat-x;
	background-position: left 75px;
}

.staff-container.blue {
	background-image: url(../images/line_blue.png);
	background-repeat: repeat-x;
	background-position: left 75px;
}

/* theater */

#content-container.theater {
	text-align: center;
	font-size: 22px;
	line-height: 36px;
}

.theater-table {
	border-collapse: collapse;
	border: none;
	border-spacing: 0;
	width: 100%;
	margin-top:40px;
}

.theater-table tr.header td {
	background-color: #f3f3f3;
	font-weight:bold;
}

.theater-table td {
	padding: 1em 1em;
	border: 1px solid #cccccc;
	text-align: center;
	background-color: #FFF;
}

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


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

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